在ES6（也就是ECMAScript 2015）推出之前，JavaScript的发展一直是比较缓慢的。现在，在2020年，最新的JavaScript功能已经被敲定，并作为ECMAScript 2020（或ES2020）发布。虽然ES2020并没有像在ES6中引入那么多的功能，但它引入了许多有用的新增功能。在本文中，我将讨论ES2020中我最喜欢的新功能。
可选链（Optional Chaining）
可选链语法允许你访问深度嵌套的对象，而不用担心属性是否存在。在处理对象时，你肯定熟悉这样的错误类型。
代码语言：javascript复制TypeError: Cannot read property <xyz> of undefined上述错误意味着你正试图访问一个未定义变量的属性。为了避免这样的错误，你的代码写起来得像这样。
代码语言：javascript复制const student={
name:'Max',
age:20,
address:{
city:'Sydney'
}
}
const streetNumber= student && student.address && student.address.street && student.address.street.number可选链可以轻松处理这些情况，而不需要检查每个节点。下面是使用可选链的一个例子。
代码语言：javascript复制const student={
name:'Max',
age:20,
address:{
city:'Sydney'
}
}
const streetNumber= student?.address?.street?.number你也可以使用可选链检查数组和函数。请看面这个例子。
代码语言：javascript复制//Arrays
let colors=['red', 'green','blue']
console.log(color?.[1]) // green
//setting color Array to null
color= null
console.log(color?.[1]) // undefined
//Functtions
let myFunc=()=>'Hello World'
console.log(myFunc?.()) //Hello World
myFunc=null
console.log(myFunc?.()) //undefinedglobalThis
JavaScript在各种环境中使用，如Web浏览器、Node.js、Web Workers等。这些环境都有自己的对象模型和不同的语法来访问它。ES2020为我们带来了globalThis属性，无论你在哪里执行代码，该属性总是引用全局对象。当你不确定代码要在什么环境中运行时，这个属性就会真正发挥作用。
下面是在Node.js中使用globalThis使用setTimeout函数的例子：
下面，在web 浏览器中使用同样的方法。
动态导入
动态导入是我最喜欢的ES2020的功能之一。顾名思义，你可以动态地导入模块。使用动态导入，代码会根据需要通过较小的捆绑包来传递（而不是像以前那样需要下载一个大捆绑包）。
当使用动态导入时，导入关键字可以作为一个函数调用，它返回一个Promise。下面是一个例子，说明当用户点击一个按钮时，如何动态导入一个模块。
Promise.allSettled()
该方法返回一个promise，该Promise在所有给定的promise被满足或拒绝后解析。它通常用于异步任务不依赖彼此成功完成的情况，如下例所示。
空值默认 （双问号语法）
这个操作符的语法是
代码语言：javascript复制let student = {}
let name = student.name ?? 'John'当左边操作数未定义或为空时，该操作符将返回右手操作数。在上面的例子中，由于student.name未定义，该操作符将把name的值设置为'John'。
乍一看，这与逻辑OR操作符( || )完全一样，然而，逻辑OR操作符右侧操作数当左侧操作数为false(undefined, null, "", 0, false, NaN)。看下面是两个运算符的比较。
结合AND (&&)或OR ( || )运算符。
AND ( &&) 和OR ( || )运算符不可能直接用??运算符。如果你需要将它们组合起来，那么你必须将&&或||运算符包在括号里。
结束语
ES2020新功能的引入，为不断发展的JavaScript增加了更多的灵活性和力量。本文探讨了我最喜欢的一些功能，但还有一些其他的功能，我建议你去研究一下，看看哪些功能最适合你。我希望你觉得这篇文章对你有所帮助，并且你和我一样对使用这些功能的到来感到非常兴奋!
原文链接
