目录
课程安排
一 JS基础Day1
重点内容：let/const变量、数据类型、ES6模板字符串
javascript介绍
1 JavaScript书写位置
1.1 JavaScript.三种书写位置？
内部：直接写在html文件里，用script标签包住。
外部：代码写在以.js结尾的文件里。
行内：代码写在标签内部（此处作为了解即可，但是后面vue框架会用这种模式）。
1.2 注意事项：
书写的位置尽量写到文档末尾</body>前面
外部js标签中间不要写代码，否则会被忽路
2 注释
单行注释：// (/右边这一行的代码会被忽略)
块注释：/**/ (在/*和*/之间的所有内容都会被忽略)
3 结束符
使用英文的分号(;）代表语句结束。
4 输入输出
4.1 输入：
prompt()：显示一个对话框，对话框中包含一条文字信息，用来提示用户输入文字
4.2 输出：
alert()：页面弹出警告对话框。
document.write()：向body内输出内容。
console.log()：控制台输出语法，程序员调试使用。
变量
练习1（变量声明、赋值和输出）
需求：
1.声明一个变量，用于存放用户购买的商品数量(um)为20件
2.声明一个变量，用于存放用户的姓名(uname)为'张三'
3.依次控制台打印输出两个变量
//1
let num;//先声明
num = 20;//再赋值
//2
let uname = '张三'
//3控制台打印输出
console.log(num);
console.log(uname);练习2（变量声明、赋值和输入输出）
需求：浏览器中弹出对话框：请输入姓名，页面中输出：刚才输入的姓名
let name = prompt("请输入姓名");//浏览器中弹出对话框
document.write(name);//页面中输出
练习3（变量声明、赋值和更新）
需求：
有2个变量：num1里面放的是10，num2里面放的是20
最后变为num1里面放的是20，num2里面放的是10
let num1 = 10;
let num2 = 20;
let temp;
temp = num1;
num1 = num2;
num2 = temp;
document.write(num1);
document.write(num2);变量拓展——数组
练习（数组取值）
需求：定义一个数组，里面存放星期一、星期二…直到星期日（共7天），在控制台输出：星期日
let date = ['星期一','星期二','星期三','星期四','星期五','星期六','星期日']
console.log(date[6])//输出数组第七个值
常量
关键字：const
类似于let，但是变量的值无法被修改。
数据类型
1 数字类型(number)
注：NaN代表一个计算错误。它是一个不正确的或者一个未定义的数学操作所得到的结果。
2 字符串类型（string）
练习（输入输出字符串、模板字符串）
需求：页面弹出对话框，输入名字和年龄，页面显示：大家好，我叫XX,今年XX岁了
let name = prompt("姓名")
let age = prompt("年龄")
document.write("大家好，我叫"+name+",今年"+age+"岁了"+ "</br>")
document.write(`大家好，我叫${name},今年${age}岁了`)3 布尔类型(boolean)
true和false
4 未定义类型和空类型（undefined和null）
只声明变量，不赋值的情况下，变量的默认值为undefined。
null仅仅是一个代表"无”、“空”或“值未知”的特殊值。
5 通过typeof关键字检测数据类型
typeof运算符可以返回被检测的数据类型。它支持两种语法形式：
1.作为运算符：typeof×（常用的写法)
2.函数形式：typeof(x)
let age = 18
let uname = '刘德华'
let flag = false
let buy
console.log(typeof age) // number
console.log(typeof uname) // string
console.log(typeof flag) // boolean
console.log(typeof buy) // undefined数据类型转换
1 隐式转换
某些运算符被执行时，系统内部自动将数据类型进行转换，这种转换称为隐式转换。
练习1
console.log(11 + 11) // 22
console.log('11' + 11) // 1111
console.log(11 - 11) // 0
console.log('11'- 11) // 0
console.log(1 * 1) // 1
console.log('1' * 1) // 1
console.log(typeof '123') // string
console.log(typeof +'123') // number
console.log(+'11' + 11) // 22练习2
需求：输入2个数，计算两者的和，打印到页面中
let num1 = +prompt('请输入第一个数字：')
let num2 = +prompt('请输入第二个数字：')
alert(`两个数相加的和是：${num1+num2}`)2 显式转换
自己写代码告诉系统该转成什么类型。
综合案例
需求：用户输入商品价格和商品数量，以及收货地址，可以自动打印订单信息
图例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>day1综合案例</title>
<style>
h2 {
text-align: center;
}
table {
border-collapse: collapse;
height: 80px;
margin: 0 auto;
text-align: center;
}
th {
padding: 5px 30px;
}
table,th,td {
border: 1px solid #000;
}
</style>
</head>
<body>
<h2>订单确认</h2>
<script>
const price = prompt("请输入商品价格：");
const num = prompt("请输入商品数量：");
const address = prompt("请输入收货地址：");
const total = num * price;
document.write(`
<table>
<tr>
<th>商品名称</th>
<th>商品价格</th>
<th>商品数量</th>
<th>总价</th>
<th>收货地址</th>
</tr>
<tr>
<td>小黑子</td>
<td>${price}</td>
<td>${num}</td>
<td>${total}</td>
<td>${address}</td>
</tr>
</table>
`)
</script>
</body>
</html>