Skip to main content

ES2020

ES2020 引入了极其常用的可选链和空值合并运算符，大幅提升了开发体验。

1. 可选链操作符 (?.)​

允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。如果引用的对象是 null 或 undefined，表达式短路返回值是 undefined。

const user = { profile: { name: 'Alice' } };
// 以前的写法
const name = user && user.profile && user.profile.name;
// ES2020 写法
const name = user?.profile?.name;

2. 空值合并运算符 (??)​

只有当左侧的操作数为 null 或者 undefined 时，才返回其右侧的操作数。相比逻辑或 ||，它不会因为左侧是 0、"" 或 false 而产生误判。

const count = 0;
console.log(count || 10); // 10 (误判)
console.log(count ?? 10); // 0 (正确)

3. Promise.allSettled()​

接收一个 Promise 数组，并返回一个在所有给定的 Promise 都已经 fulfilled 或 rejected 后的 Promise，并带有一个对象数组，每个对象表示对应的 Promise 结果。非常适合需要知道所有异步操作结果（不关心成功失败）的场景。

Promise.allSettled([Promise.resolve(1), Promise.reject('error')])
  .then(results => console.log(results));
// [{ status: "fulfilled", value: 1 }, { status: "rejected", reason: "error" }]

4. 动态导入 (Dynamic Import)​

支持在运行时按需加载 ES 模块，返回一个 Promise。这对代码分割（Code Splitting）和懒加载（Lazy Loading）非常有用。

import('/module.js')
  .then(module => module.doSomething())
  .catch(err => console.error(err));

5. BigInt​

第七种原始数据类型，提供了一种方法来表示大于 2^53 - 1（Number.MAX_SAFE_INTEGER）的整数。在数字后面加上 n 即可。

const huge = 9007199254740991n;
console.log(typeof huge); // "bigint"

6. globalThis​

提供了一个标准的方式来获取不同环境下的全局 this 对象。

  • 在浏览器中，它指向 window
  • 在 Web Workers 中，它指向 self
  • 在 Node.js 中，它指向 global