Skip to main content

ES2022

ES2022 大幅增强了 Class 类的写法，并提供了更安全的属性访问和数组索引方法。

1. 顶层 Await (Top-level await)​

在 ES 模块的顶层，你可以直接使用 await，而不需要再把它包裹在一个 async 函数中了。这对于动态加载依赖或初始化配置非常方便。

// 直接在模块顶层使用
const response = await fetch('/api/config');
export const config = await response.json();

2. Class 类的增强​

  • 声明类的字段：不再需要全写在 constructor 里。
  • 私有属性与方法：使用 # 前缀定义真正的私有字段，外部无法访问。
  • 静态块 (Static Initialization Blocks)：用于在类初始化时执行复杂的静态逻辑。
class Person {
  // 公共字段
  name = 'Lucas';
  // 私有字段
  #age = 25;

  getAge() {
    return this.#age;
  }
}
const p = new Person();
console.log(p.name); // "Lucas"
// console.log(p.#age); // SyntaxError: Private field '#age' must be declared in an enclosing class

3. Array.prototype.at()​

提供了一种更优雅的方式来访问数组（或字符串）的元素，特别是支持负数索引从后往前查找，无需再写 arr[arr.length - 1]。

const arr = [10, 20, 30, 40];
console.log(arr.at(-1)); // 40 (取最后一个元素)
console.log(arr.at(-2)); // 30

4. Object.hasOwn()​

作为 Object.prototype.hasOwnProperty() 的更安全的替代品。它解决了如果对象使用 Object.create(null) 创建时没有继承原型方法导致报错的问题。

const obj = { key: 'value' };
console.log(Object.hasOwn(obj, 'key')); // true

5. Error Cause (异常链)​

在抛出错误时，可以通过 { cause: error } 的选项，将原始的底层错误传递给上层调用者，保留了完整的错误追踪链。

try {
  fetchData();
} catch (err) {
  throw new Error('Failed to fetch data', { cause: err });
}