随着前端技术的不断发展，ES11（也称为 ECMAScript 2020）在 2020 年 6 月正式发布，引入了许多新的特性和语法，为前端开发带来了更多的便利和可能性。本文将介绍 ES11 中新出现的技术栈，并为读者提供深入学习和实践的指导。
1. 可选链运算符
在 ES11 之前，我们通常使用 && 运算符来判断对象中是否存在某个属性，例如：
-- ---- -- --------- - -- -- --------- -
但是这种写法比较繁琐，如果嵌套的属性比较多，代码会变得非常冗长。ES11 引入了可选链运算符 ?.，可以更方便地处理这种情况：
-- ----------- - -- -- --------- -
如果 obj 存在且 prop 存在，则条件成立；否则条件不成立。
可选链运算符还可以用于函数调用：
------------
如果 obj 存在，则调用 func() 函数；否则不执行。
2. 空值合并运算符
在 JavaScript 中，如果我们想要给变量设置一个默认值，通常使用 || 运算符：
----- - - - -- --
如果 a 为真，则 x 的值为 a；否则 x 的值为 b。但是如果 a 的值为假值（例如 0 或 ''），则 x 的值也会被设置为 b，这可能会导致一些难以察觉的问题。
ES11 引入了空值合并运算符 ??，可以更安全地设置默认值：
----- - - - -- --
如果 a 的值为 null 或 undefined，则 x 的值为 b；否则 x 的值为 a。
3. Promise.allSettled()
在 ES6 中，我们引入了 Promise 对象来处理异步操作，但是 Promise 的错误处理比较麻烦，需要使用 .catch() 方法来捕获错误。ES11 引入了 Promise.allSettled() 方法，可以更方便地处理多个 Promise 对象的状态：
----------------------------- --------- -----
------------- -- -
-- ------- ---- ------- -----
--Promise.allSettled() 方法返回一个 Promise 对象，该对象在所有 Promise 对象都执行完毕后才会 resolve，resolve 的值是一个数组，包含所有 Promise 对象的状态。每个状态对象都包含以下属性：
status：Promise 对象的状态，可能的值为fulfilled（已完成）或rejected（已拒绝）。value（可选）：如果 Promise 对象的状态为fulfilled，则为 Promise 对象的返回值。reason（可选）：如果 Promise 对象的状态为rejected，则为 Promise 对象的错误信息。
4. String.prototype.matchAll()
在 ES6 中，我们使用正则表达式的 g 标志来匹配字符串中的所有符合条件的子串，例如：
----- --- - ------ ------- ----- ----- - ----- ----- ------- - ----------------- -- ----- ---- ----
但是 match() 方法只返回第一个匹配的子串，如果我们想要获取所有匹配的子串，就需要使用循环来实现。ES11 引入了 String.prototype.matchAll() 方法，可以更方便地获取所有匹配的子串：
----- --- - ------ ------- ----- ----- - ----- ----- ------- - ------------------------- -- ------ ------ -- ------ ------ -------- ----- ------ -- ------ ------ -------- ----- ------ -- ------ ------ --------
matchAll() 方法返回一个迭代器对象，可以使用 for...of 循环来遍历所有匹配的子串。每个子串都是一个数组，包含以下属性：
- 匹配的子串
index：匹配的子串在原字符串中的起始位置input：原字符串
5. BigInt
在 JavaScript 中，数字类型只能表示 253-1 以内的整数，如果超出这个范围，就会失去精度。ES11 引入了 BigInt 类型，可以表示任意大的整数：
----- - - ----- ----- - - -----------------------------------------
BigInt 类型的值必须以 n 结尾，或者使用 BigInt() 函数来创建。
BigInt 类型的值可以和普通数字类型进行运算，但是需要注意类型转换的问题：
----- - - ----- ----- - - ---- ----- - - - - ---------- -- ----
总结
ES11 引入了许多新的特性和语法，包括可选链运算符、空值合并运算符、Promise.allSettled() 方法、String.prototype.matchAll() 方法和 BigInt 类型。这些新特性可以让我们更方便地处理各种问题，提高开发效率和代码质量。读者可以通过学习和实践这些新特性，提高自己的前端技能，更好地应对未来的开发挑战。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/662c73a5d3423812e49f92ad