黑马程序员前端JavaScript入门到精通全套视频教程，javascript核心进阶ES6语法、API、js高级等基础知识和实战教程，JS基础第一天学习
一、JavaScript简介
1.JS简介
（1）JavaScript是一种运行在客户端（浏览器）的编程语言，实现人机交互。
（2）可以实现的作用：
①网页特效：监听用户的一些行为，让网页做出对应的反馈
②表单验证：针对表单数据的合法性进行判断
③数据交互：获取后台数据渲染到前端
④服务端编程：node.js
（3）JS的组成
①ECMAScript：规定了JS基础语法核心知识，如变量、分支语句、循环语句等
②web APIs，包括DOM（DOM操作文档，对页面元素进行移动、大小缩放、添加删除等）和BOM（操作浏览器，如页面弹窗、检测窗口宽度、存储数据到浏览器等）
（4）JavaScript的权威网站：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript (直接搜索MDN）
2.JS书写位置
（1）行内JS（内联JS）：代码写在标签内部
html
<html>
<body>
<button onlick="alert=('逗你玩')">点击</button>
</body>
</html>（2）内部js：script标签写在HTML文件里面的上面，用script标签包住。
注意事项：将
3.JS注释
（1）单行注释
符号：//
快捷键：Ctrl+/
（2）多行注释
符号：/*注释内容*/
快捷键：shift+alt+a
4.JS结束符
结束符：分号;
注意：要么都写，要么都不写
5.输入语法和输出语法
（1）输出语法
① alert('要输出的内容')：在页面中弹出警告窗口
② console.log('控制打印输出')： 控制控制台的输出，调试代码的时候
③document.write('要输出的内容')：向body输出内容，如果输出的内容是标签，也会被解析成网页元素
（2）输入语法
prompt('请输入内容')： 显示一个对话框，对话框的上方有一条文字信息，提示用户输入文字
（3）JavaScript代码执行顺序： 按HTML文档流顺序执行JavaScript代码，alert（）和prompt()它们会跳过渲染先被执行
二、变量
1.变量的本质
变量的本质：是程序在内存中申请的一块用来存放数据的小空间 。
2.变量的命名规范与规则
（1）规则
①不能使用关键字，如let、var、if、for等
②只能用下划线、字母、数字、$ 组成，且数字不能写在开头
③ 字母严格区分大小写
（2）规范
① 起名要有意义，见名知意
②遵循小驼峰命名法
③第一个单词首字母小写，后面每个单词的首字母大写，如userName
3.变量的基本使用
（1）变量的声明
① 组成：关键字+变量名：let 变量名
②关键字是系统提供的专门定义变量的
③let同一个变量不可以重复声明
（2）变量的赋值：age=18通过变量名获取数据
三、常量
使用const声明的变量，声明初始化之后，值不可以改变。
注意：声明的时候必须赋值
四、数据类型
1.基本数据类型
①number 数字型：包括整数、小数、正数、负数
② string 字符串类型：通过引号包裹的的数据叫字符串，推荐使用单引号（引号必须成对使用，单双引号可以相互嵌套，但是不可自己嵌套自己，必要时可以使用转义字符\，输出单引号或者双引号）
③ boolean 布尔型：表示肯定或者否定，有两个固定的值，肯定用true，否定用false
④ undefined 未定义型：在只申明变量没有赋值的时候，变量默认为undefined
⑤null空：将来存放对象的时候可以给null
⑥typeof检测数据类型
2. 引用数据类型
① object 对象
② function函数
③array数组
五、数据类型转换
1.隐式转换
某些运算符被执行时，系统内部自动将数据类型转换
转换技巧：
① +两边只要有一个式字符串，就会把另外一个转换成字符串
② 除了+以外的运算符，都会把数据转换成数字类型
2.显式转换
隐式转换的规律并不清晰，大多都是依靠经验总结，所以为了避免隐式转换带来的问题，同常需要对数据进行显式转换
（1）转换成数字
① Number：显式转换成数值类型，可以用Number包裹，也可以在数据前面加一个+
② NaN也是number数据类型的一种，代表非数字，promt取过来的数据是字符串类型
③ parselnt：只保留整数，只舍弃不入
④parse Float：可以保留小数
（2）转换成字符串
① String（）
②变量.toString（）:括号里面可一跟进制
六、模板字符串
1.使用场景
拼接字符串和变量
2.语法
①使用反引号（在因为输入模式下，按下键盘Tab键上方的那个键）；
② 内容拼接时，使用${}包住变量
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>订单确认</title>
<style>
h2 {
text-align: center;
}
table {
margin: 0 auto;
border-collapse: collapse;
height: 100px;
text-align: center;
}
th {
padding: 5px 30px;
}
table,
th,
td {
border: 1px solid #000;
}
</style>
</head>
<body>
<h2>订单确认</h2>
<script>
// 用户输入
let price = +prompt('请输入价格')
let num = +prompt('请输入数量')
let address = prompt('请输入地址')
// 计算总额
let total = price * num
// 打印表格
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>