持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第11天，点击查看活动详情

前言

本文从我们熟悉的es6开始整理出ECMAScript的一些重大更新或者比较重要的新特性，让面试不会在答错

ECMAScript是什么：

可以看作是javaScript的标准化规范
javaScript是ECMAScript的扩展语言
ECMAScript只提供了最基本的语法
浏览器中：JavaScript = ECMAScript + BOM + DOM
node中：JavaScript = ECMAScript + fs + net + etc.

es2015（es6）新特性

let：块级作用域
const：let基础上增加只读，不能被修改，指的是内存地址
解构：数组解构，对象解构，如：[...arr], {...obj}
模版字符串：``
字符串的扩展方法：startsWith()、endsWith()、includes()，都返回true/false
参数默认值：要写在参数后面，如：function f(a:123)
剩余参数：...args，放最后
箭头函数：=>，没有this的机制
对象字面量的增强：

变量名与值名相同时可以只写一个
函数可以省略function，直接写方法
计算属性名，加[]

Object.assign：Object.assign(target,source1,source2)，用于复制合并多个源对象到target对象，如：Object.assign({}, obj), 可用于复制对象
Object.is：同值比较的算法，判断两值是否相等
Proxy：代理，监视属性读写(理解为门卫，输入输出都需要经过门卫)，类比es5的defineProperty

Reflect：统一提供一套操作对象的API，包含13个方法，reflect成员方法就是Proxy处理对象的默认实现，如：

const obj = {name: 'logan',age: 18}
// 原始操作
console.log('name' in obj)
console.log(delete obj.name)
console.log(Object.keys(obj))
// Reflect API操作
console.log(Reflect.has(obj,'name'))
console.log(Reflect.deleteProperty(obj,'name'))
console.log(Reflect.ownKeys(obj))

Promise: 解决异步编程中回调函数的嵌套问题
class类
静态方法：static，注意this
类的继承：extends，调用super()相当于调用父类的构造函数
Set：集合，不允许重复（可用于数组去重等）
Map：数据结构，可以以任意类型的值作为键，对象只能以字符串作为键(es6 可以用Symbol())
Symbol：最主要的作用就是为对象添加独一无二的属性名
for...of：遍历数组，能用break终止遍历，foreach, map不能被终止
原理：可迭代接口iterator
注意：for...in 是es5的
迭代器模式：对外提供统一遍历接口，示例代码太长，这就不贴了
生成器 generator：* yield
应用：自增id
ES Modules：模块化

es2016（es7）新特性

includes：数组方法，判断有没有该值，返回true/false
指数运算符：2**10，等于1024，Math.pow(2, 10)

es2017（es8）新特性

Object.values(obj)：获取对象的值转换为数组
Object.entries(obj)：返回键值对数组
Object.getOwnPropertyDescriptors(obj)：配合es6 get set 所使用
String.prototype.padStart / String.prototype.padEnd：补充字符串达到指定长度
可以在函数参数中添加尾逗号：方便开发
Async/Await：promise语法糖

es2018（es9）新特性

展开和剩余应用在对象上（对象的解构）
正则表达式的增强

环视

var res = str.replace(/张三(?=丰)/g, '李四')
var res = str.replace(/张三(?!丰)/g, '李四')

'A00 B00'.replace(/(?<=A)00/g, '88')
'A00 B00'.replace(/(?<!A)00/g, '88')

正则命名组

Promise.prototype.finally(), 不管成功失败都会走

es2019（es10）新特性

数组稳定排序
如果按相同的id排序，确保每次排序的结果都是相同的
try ... catch
catch的参数可省略(e)

es2020（es11）新特性

空值合并运算符

function(options){
 // 只有size = null 或者 undefined，才会走??后的值，为了避免0的情况
 options.size = options.size ?? 100
 }

可选链运算符

// 以前
 const res = item.userInfo ? item.userInfo.name
 // 现在
 const res = item.userInfo?.name
 // obj?.prop
 // obj?.[expr]
 // arr?.[index]
 // func?.(args)

es2021（es12）新特性

String.prototype.replaceAll
Promise.any

es2022（es13）新特性

...

总结

想学习更多详细更新可到官方github上查看，附上地址github
整理不易，如果有帮到你，给个赞吧！👍

往期精彩文章

🌟Promise 面试常考手写方法汇总
🌟Promise 常见误区
🌟js 柯里化艺术
🌟简述BFC是什么，以及在工作中的应用场景
🌟从浏览器输入网址到页面渲染中间发生了什么(通俗易懂)

ECMAScript新特性汇总，面试别在答错

前言