ECMAScript 2020 在 JavaScript 标准中带来了一些新的特性，从与并发相关的更改到与语言元素相关的功能，这些变化都很有趣。接下来我们会一一详细讲解这些值得关注的新特性，并包含相应的示例代码，希望能给前端开发者带来一些学习和指导意义。
1. BigInt
BigInt 是 ECMAScript 2020 中新增的一种数据类型，它可以用来处理超出 JavaScript 数值范围范围的整数。BigInt 可以表示大于 2 的 53 次方减一的数，这是 JavaScript Number 类型可以表示的最大整数值。下面是 BigInt 的示例代码：
let x = BigInt(Number.MAX_SAFE_INTEGER) + 1n; console.log(x); // 输出为9007199254740992n
在上面的代码中，我们使用 Number.MAX_SAFE_INTEGER 获取了 JavaScript 数值范围内可以表示的最大整数值，然后使用 1n 表示一个 BigInt 常量。最后将它们相加后，x 的值将会是一个 BigInt 类型的常量 9007199254740992n。
2. 动态导入
在 ECMAScript 2020 中，引入了用于动态导入模块的 import() 函数。这个函数接收一个字符串参数，表示要加载的模块路径。下面是动态导入的示例代码：
async function dynamicImport() {
const module = await import('./module.js');
const result = module.doSomething();
console.log(result);
}上面的示例代码中，我们使用了 async/await 的语法糖，首先使用 import() 函数动态地导入了一个名为 module.js 的模块，然后调用它的 doSomething() 方法，并将结果输出到控制台中。
3. Promise.allSettled()
Promise.allSettled() 函数可以接受一个 Promise 数组作为参数，并返回一个 Promise，当所有 Promise 对象都返回结果时，该 Promise 对象的状态会变为已完成（Fulfilled）。与 Promise.all() 不同的是，即使 Promise 对象返回的是 rejected 状态，Promise.allSettled() 函数也会等待所有 Promise 对象都返回结果，然后返回它们的状态和值。下面是 Promise.allSettled() 的示例代码：
-- -------------------- ---- ------- ----- -------- - - ------------------- --------------------- ------------ ------------------- -- ------------------------------------------- -- - --------------------- ---
在上面的代码中，我们定义了一个包含三个 Promise 对象的数组，其中第二个 Promise 对象的状态为 rejected，并会抛出一个错误。Promise.allSettled() 函数在所有 Promise 对象都返回结果后返回一个数组，该数组包含每个 Promise 对象的状态和值，无论它们是 resolved 还是 rejected。
4. 可选的链判断操作符
通过可选的链判断操作符（?.）可以简化对可能不存在的值的访问，可以更优雅地处理 null 或 undefined 的情况。下面是可选的链判断操作符的示例代码：
-- -------------------- ---- -------
----- ---- - -
----- -------
-------- -----
---- -
------ --------- -----------
--------- -
----- ---- ------
------ -----
--
--
--
----------------------------------- -- --- ---------
---------------------------------------- -- --- ----通过可选的链判断操作符可以避免因为访问 null 或 undefined 值而导致代码抛出异常的问题。
5. 异步迭代器
异步迭代器使得我们可以按照自定义的顺序异步遍历数据，可以用于处理由异步数据源生成的数据集合。下面是异步迭代器的示例代码：
-- -------------------- ---- -------
----- --------- ---------------- -
----- --
----- --
----- --
-
------ -------- -- -
--- ----- ---- --- -- ----------------- -
-----------------
-
-----在上面的代码中，我们通过 async/await 的语法糖定义了一个异步的生成器函数 asyncGenerator()，该函数会异步地生成一些数字，并用 yield 关键字返回。然后在主函数中使用 for-await-of 循环遍历异步生成器函数，同时使用 await 关键字等待每个异步生成器函数的结果，并输出到控制台中。
结论
以上这些新特性提供了更好的表现和更方便的开发体验。BigInt 和可选的链判断操作符使代码更加健壮和易于维护，动态导入和异步迭代器可以提高开发者的效率。同时这些新特性也反映了 JavaScript 的不断发展和创新，我们需要不断学习和掌握它们，用它们来更好地推动我们的前端项目发展。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67073140d91dce0dc865b242