哔哩哔哩：https://www.bilibili.com/video/BV1rDw4e6Ew1/
一、理论基础
学前基础：JavaScript 基础语法
参考文档：https://es6.ruanyifeng.com/
1、什么是ES6
ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。
浏览器支持度查询：https://caniuse.com/?search=ECMAScript
Node.js是JavaScript语言的服务器运行环境，对ES6的支持度比浏览器更高
Babel 转码器
由于IE不支持ES6，就需要使用Babel进行转码。Babel是一个广泛使用的ES6转码器，可以将ES6代码转为ES5代码，从而在浏览器或其他环境执行
ECMAScript 和 JavaScript的关系
ES6 与 ES2015之间的关系
ES5(ECMAScript 5): 于 2009 年发布，是许多浏览器支持的首个广泛采用的 JavaScript 版本
ES6(ECMAScript 2015): 于 2015 年发布，引入了许多新的语法特性和功能，如箭头函数、类、模块等
ES7(ECMAScript 2016): 于 2016 年发布，引入了一些新的特性，如指数操作符、Array.prototype.includes()
ES8(ECMAScript 2017): 于 2017 年发布，引入了异步函数、共享内存和原子操作等新的功能.
ES9(ECMAScript 2018): 于 2018 年发布，引入了异步选代器、正则表达式命名捕获组等新的功能。
ES10（ECMAScript 2019）、ES11（ECMAScript 2020）ES12（ECMAScript 2021）
二、环境搭建
2、环境搭建
请参见js环境搭建
- nodejs
- vscode
三、基础语法
3、let声明变量
用法与var类似：声明一个变量
不同点：
- 块级作用域{
let a = 10;
var b = 1;
}
a // ReferenceError: a is not defined.
b // 1
// 适合for循环的计数变量
for (let i = 0; i < 10; i++) {
// …
}
console.log(i);
// 示例一
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 10
// 示例二
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 6 - 不允许重复声明// 报错
function func() {
let a = 10;
var a = 1;
}
// 报错
function func() {
let a = 10;
let a = 1;
} - 不会进行变量提升var a;
a = 1;
let a;
a = 1; - 暂存性死区var tmp = 123;
if (true) {
tmp = ‘abc’; // ReferenceError
let tmp;
}
4、const声明常量
const声明一个只读的常量。一旦声明，常量的值就不能改变。
const声明的常量不得改变值，这意味着，const一旦声明常量，就必须立即初始化，不能留到以后赋值。
作用域与let相同
本质
const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，因此等同于常量。但对于复合类型的数据（主要是对象和数组），变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的（即总是指向另一个固定的地址），至于它指向的数据结构是不是可变的，就完全不能控制了。因此，将一个对象声明为常量必须非常小心。
5、顶层对象
顶层对象，在浏览器环境指的是window对象，在 Node 指的是global对象。ES5 之中，顶层对象的属性与全局变量是等价的。
- 浏览器里面，顶层对象是
window，但 Node 和 Web Worker 没有window。 - 浏览器和 Web Worker 里面，
self也指向顶层对象，但是 Node 没有self。 - Node 里面，顶层对象是
global，但其他环境都不支持。
从 ES6 开始，全局变量将逐步与顶层对象的属性脱钩
同一段代码为了能够在各种环境，都能取到顶层对象，现在一般是使用this关键字，但是有局限性。
ES2020 在语言标准的层面，引入globalThis作为顶层对象。也就是说，任何环境下，globalThis都是存在的，都可以从它拿到顶层对象，指向全局环境下的this