ECMAScript 2020 (ES11) 新特性一覧-JavaScript中文网-JavaScript教程资源分享门户

ECMAScript（简称 ES）是 JavaScript 的标准化语言规范，其定期更新会带来一些新的特性和语言功能，为开发人员带来更好的开发体验和更高的代码质量。在本文中，我们将重点介绍 ECMAScript 2020（ES11）中的新特性。

1. 可选链式调用

可选链式调用是一项新功能，用于避免在访问嵌套对象时出现错误，这些对象可能未定义或为空。在以前，我们在使用嵌套对象时，可能会出现以下代码：

if (obj && obj.innerObj && obj.innerObj.property) {
    // do something
}

这个判断包含了太多重复的代码，同时也不够清晰。使用可选链式调用，上述代码可以简化如下：

if (obj?.innerObj?.property) {
    // do something
}

在这个示例中，使用“?”代替了“&&”，当尝试访问内部对象时，如果内部对象不存在，则会自动返回 undefined，不会出现运行时错误。

2. 动态import()

动态import()是一个新的函数，它允许开发者动态的异步加载 JavaScript 模块，这个新函数可以是异步的，也可以是同步的，使得开发者可以在浏览器运行 JavaScript 代码时，按需加载模块，有助于加快应用程序的加载时间。

async function loadModule() {
    const myModule = await import('./myModule.js');
    myModule.doSomething();
}

在这个示例中，我们使用ES6的 async/await语法，加载了一个名为 myModule.js的模块，并在完成加载后，调用了其 doSomething()函数。

3. BigInt

BigInt 是一种新的 JavaScript 数据类型，用于表示任意大的整数，其最大范围有 2 ^ 53 - 1 的大小限制，而 BigInt 的最大范围则可以达到 2 ^ 1024 - 1。这使得 JavaScript 能够执行大型计算，而不需要使用额外的库或工具。

const maxBigInt = BigInt(Number.MAX_SAFE_INTEGER) + 1n;
console.log(maxBigInt);
// 输出：9007199254740993n

在这个示例中，我们将 Number.MAX_SAFE_INTEGER传递给 BigInt() 函数，创建了一个比 Number类型更大的整数，然后添加了 1n，得到了一个大于 Number.MAX_SAFE_INTEGER 的整数。

4. Promise.allSettled()

Promise.allSettled() 是一个新的 Promise API，它可以返回一个 Promise，该 Promise 将在所有给定的 Promise 都已解决或拒绝后，返回一个包含每个 Promise 状态的对象数组。

-- -------------------- ---- -------
----- -------- - -
    -------------------
    ------------------------
    ------------------
--

----------------------------
    ------------ -- ---------------------

-- ----
--     - ------- ------------ ------ - --
--     - ------- ----------- ------- ------- --
--     - ------- ------------ ------ - -
-- -

在这个示例中，我们创建了一个包含三个 Promise 的数组。第一个 Promise 已解决并返回 1，第二个 Promise 被拒绝，返回一个错误信息 Error，第三个 Promise 解决并返回 3。当使用 Promise.allSettled() 时，可以异步处理所有 Promise，并在所有 Promise 都已解决或拒绝后，返回一个包含每个 Promise 状态的对象数组。

5. 双问号运算符

双问号运算符（ ?? ）用于判断某个值是否存在，如果不存在，则返回一个默认值。这与类似 || 的操作符不同，|| 只有在值为 false 时返回默认值。

const num1 = null ?? 0;
console.log(num1); // 输出：0

const num2 = undefined ?? 1;
console.log(num2); // 输出：1

在这个示例中，我们使用 ?? 运算符，尝试在值为 null 或 undefined 时为变量分配一个默认值。第一个变量在使用 ?? 运算符时，给它分配了一个默认值为 0，因为值为 null。第二个变量在使用 ?? 运算符时，给它分配了默认值 1，因为其值未定义。

结论

通过这篇技术文章，你已经了解了 ECMAScript 2020 中的新特性和语言功能，以及如何使用它们来增强你的设计和开发能力。可以尝试在你的项目中使用这些新特性并掌握它们的技能，以提高你的代码质量和开发效率。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/672b06d4ddd3a70eb6d1670d