前言：这里只是简单列出ES新特性，以及举例新特性的写法，想要更深入的了解，比如新特性和之前写法的区别、好处、优缺点以及更多的使用场景，可以自行挖掘呦，这里就不一一介绍了。欢迎评论补充。
ES6（2015）
1、let和const
在ES6之前JS是没有块级作用域，在ES6之后，有了块级作用域的概念，const与let都是块级作用域。
{ var a = 1; let b = 2; const c = 3; }
console.log(a); // 1
console.log(b); // Uncaught ReferenceError: b is not defined
console.log(c); // Uncaught ReferenceError: c is not defined
2、解构赋值
可以方便的从数组或者对象中快速提取值赋给定义的变量。
let obj = { name: "zhu", age: 3 };
let { name, age } = obj;
console.log(name); // zz
console.log(age); // 3
3、模版字符串
var a = "zhuzhu";
var str = 'my name is' + a // 字符串拼接
var str2 = `my name is ${a}`; // 模板字符串
console.log(str); // my name is zhuzhu
console.log(str2); // my name is zhuzhu
4、函数默认参数
function foo(a = 1, b = 2) { // a、b的默认值
console.log(a) // 3
console.log(b) // 4
}
foo(3, 4) // 这里不传，打印的就是1、2
5、箭头函数（Arrow function）
() => { }
// 举例
var list = [1, 2, 3, 4, 5];
const newList = list.map(item => item * 2);
console.log(newList); // [2, 4, 6, 8, 10]
6、扩展运算符
延展操作符（三个点...）可以在函数调用/数组构造时, 将数组表达式或者string在语法层面展开；还可以在构造对象时, 将对象表达式按key-value的方式展开
let objClone = { ...obj };
7、symbol
symbol 是ES6 引入了一种新的基本数据类型（原始数据类型） Symbol ，表示独一无二的值。它是JavaScript 语言的第七种数据类型，前六种是： undefined 、 null 、布尔值（Boolean）、字符串（String）、数值（Number）、对象（Object）。
每个从 Symbol() 返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符；这是该数据类型仅有的目的
// Symbol语法与描述：直接使用 Symbol() 创建新的symbol类型，并用一个可选的字符串作为其描述
const symbol1 = Symbol();
const symbol2 = Symbol(42);
const symbol3 = Symbol('foo');
console.log(typeof symbol1); // "symbol"
console.log(symbol3.toString()); // "Symbol(foo)"
console.log(Symbol('foo') === Symbol('foo')); // false
8、新的数据结构：Set
Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。
// 可用于数组去重
const numbers = [54,34,54,2,3,4,1,4,2,2,76,54,78,90,12,34];
console.log([...new Set(numbers)]); // [54, 34, 2, 3, 4, 1, 76, 78, 90, 12]
9、新的数据结构：Map
Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
const map = new Map();
map.set('foo', true);
map.set('bar', false);
10、模块化，export 和 export default import
export 和 export default 都可用于导出常量、函数、文件、模块等 ，
export、import可以有多个，export default仅有一个
通过export方式导出，在导入时要加{ }，且不能自定义名字，export default不用加{ }，且可以自定义名字
function renderHtml(url) { }
module.exports = {
renderHtml
} // 导出
import { renderHtml } from "./module/renderHtml.js"; // 导入
function renderHtml(url) { }
exports.renderHtml = renderHtml; // 导出
import renderHtml from './module/renderHtml.js' // 导入
ES7（2016）
1、数组方法include
判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。
const arr = [1, 2, 3]
console.log(arr.includes(2)); // true
console.log(arr.includes(4)); // false
2、指数操作符**
相当于Math.pow()
2**10 // 1024
Math.pow(2,10) // 1024
ES8（2017）
1、async/await
Promise可以解决回调地狱的问题，但是链式调用太多，则会变成另一种形式的回调地狱 —— 面条地狱，所以在ES8里则出现了Promise的语法糖async/await，专门解决这个问题。
const runTask = async (code) => {
await registeredTask(); // 注册任务
};
runTask();
2、padStart()和padEnd()
用来补齐字符串
const str = '5';
console.log(str.padStart(2, '0')); // 05
console.log(str.padEnd(2, '0')); // 50
3、Object.values和Object.entries
Object.values()是一个与Object.keys()类似的新函数，但返回的是Object自身属性的所有值，不包括继承的值。
object.entries返回包含对象键名和键值的数组。
var obj = { name: "张三", age: 10 };
Object.values(obj) // ["张三", 10]
for (let [key, value] of Object.entries(obj)) {
console.log(`${key}: ${value}`)
// name: 张三
// age: 10
}
4、函数拓展，es2017规定函数的参数列表的结尾可以为逗号
5、Object.getOwnPropertyDescriptors()
方法用来获取一个对象的所有自身属性的描述符
const obj2 = { name: 'Jine', get age() { return '18' } };
Object.getOwnPropertyDescriptors(obj2)
6、SharedArrayBuffer对象
SharedArrayBuffer 对象用来表示一个通用的，固定长度的原始二进制数据缓冲区，类似于 ArrayBuffer 对象，它们都可以用来在共享内存（shared memory）上创建视图。与 ArrayBuffer 不同的是，SharedArrayBuffer 不能被分离。
let sab = new SharedArrayBuffer(1024); // 必须实例化
worker.postMessage(sab);
ES9（2018）
1、for await...of
异步迭代器，主要用来遍历异步对象
2、promise.prototype.finally()，无论premise失败成功都会走的方法
.then(() => {
// 成功
}).catch(() => {
// 失败
}).finally(() => {
// 成功失败都走这里
});
3、对象的扩展运算符
let obj1 = {c: 3} let obj = {...obj1,d:4}
ES10（2019）
1、trimStart和trimEnd，用来移除字符串首位空白格
var str=" 123"; str.trimStart(); // 123
2、flat和flatMap，用于创建并返回一个新数组
var arr1 = [1, 2, 3, 4]
arr1.map(x => [x * 2]) // [[2], [4], [6], [8]]
arr1.flatMap(x => [x * 2]) // [2, 4, 6, 8]
// 深度为1
arr1.flatMap(x => [[x * 2]]) // [[2], [4], [6], [8]]
3、Object.formEntires
可以把键值对列表转化成一个对象，和 Object.entries() 相对的。
Object.fromEntries([
['foo', 1],
['bar', 2]
]) // {foo: 1, bar: 2}
4、symbol描述，let dog = Symbol("dog")，dog为描述
5、toString()
6、catch，es2019之前，catch是带有参数，现在不带参数
// 之前
try {} catch(e) {};
// 现在
try {} catch() {}
ES11（2020）
1、BigInt，js第八种基本类型，BigInt 可以表示任意大的整数
2、空格合并运算符（??），只有 ?? 左边为 null 或 undefined时才返回右边的值
3、可选链操作符
// 之前写法
const name = (system && system.user && system.user.addr && system.user.addr.province && system.user.addr.province.name) || 'default';
// 之后写法
const name = system?.user?.addr?.province?.name || 'default';
ES12（2021）
1、replaceAll
返回全新字符串，所有符合匹配规则的字符都将被替换掉
var str = "hello word";
// 之前
str.replace(/o/g, "a); // hella ward
// 现在
str.replaceAll("o", "a"); // hella ward
2、promise.any
只要其中一个promise成功，就返回那个已经成功的permise，如果可叠戴对象中没有一个premise成功，就返回一个失败的premise
const promise1 = () => {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("promise1");
// reject("error promise1 ");
}, 3000);
});
};
const promise2 = () => {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("promise2");
// reject("error promise2 ");
}, 1000);
});
};
const promise3 = () => {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("promise3");
// reject("error promise3 ");
}, 2000);
});
};
Promise.any([promise1(), promise2(), promise3()])
.then((first) => {
// 只要有一个请求成功 就会返回第一个请求成功的
console.log(first); // 会返回promise2
})
.catch((error) => {
// 所有三个全部请求失败 才会来到这里
console.log("error", error);
});
3、weakRefs
使用weakRefs的class类创建对对象的弱引用
4、逻辑运算符和赋值表达式
新特性结合了逻辑运算符（&&，||，??）和赋值表达式，
（1）&&=： x &&= y等同于x && (x = y);
（2）||=：x ||= y 等同于：x || (x = y)
（3）??=：x ??= y 等价于： x ?? (x = y);
5、数字分隔符
用下划线 _（U+005F）在数字间进行分隔。
let num = 1_000_000_000
