以下是 ES13(ECMAScript 2022)中一些新特性的用法总结,包括私有属性、类静态属性、静态代码块、最外层的 await、at 函数、正则匹配的开始和结束索引等。
1. 私有属性 (Private Class Fields)
用法
私有属性是类中只能在类内部访问的属性,外部无法直接访问。私有属性通过在属性名前加 # 来定义。
class MyClass {
#privateField = 42;
getPrivateField() {
return this.#privateField;
}
}
const instance = new MyClass();
console.log(instance.getPrivateField()); // 42
console.log(instance.#privateField); // SyntaxError: Private field '#privateField' must be declared in an enclosing class
使用场景
- 当需要隐藏类的内部实现细节时,可以使用私有属性。
- 防止外部代码直接修改类的内部状态。
2. 类静态属性 (Static Class Fields)
用法
静态属性是类本身的属性,而不是实例的属性。静态属性通过 static 关键字定义。
class MyClass {
static staticField = 42;
static staticMethod() {
return this.staticField;
}
}
console.log(MyClass.staticField); // 42
console.log(MyClass.staticMethod()); // 42
使用场景
- 当需要定义与类本身相关的属性或方法时,可以使用静态属性。
- 例如,用于存储类的配置、常量或工具方法。
3. 静态代码块 (Static Initialization Blocks)
用法
静态代码块允许在类定义时执行一些初始化逻辑,通常用于初始化静态属性。
class MyClass {
static staticField;
static {
this.staticField = 42;
}
}
console.log(MyClass.staticField); // 42
使用场景
- 当静态属性的初始化逻辑较为复杂时,可以使用静态代码块。
- 例如,需要根据某些条件动态初始化静态属性。
4. 支持最外层的 await (Top-level await)
用法
在 ES13 中,await 可以在模块的最外层使用,而不必包裹在 async 函数中。
// module.js
const data = await fetchData();
console.log(data);
export default data;
使用场景
- 当需要在模块加载时执行异步操作时,可以使用最外层的
await。 - 例如,在模块加载时获取配置或初始化数据。
5. at 函数 (Array.prototype.at)
用法
at 方法允许通过索引访问数组元素,支持负数索引(从数组末尾开始计数)。
const array = [1, 2, 3, 4, 5];
console.log(array.at(0)); // 1
console.log(array.at(-1)); // 5
使用场景
- 当需要访问数组的最后一个元素或倒数第几个元素时,可以使用
at方法。 - 比传统的
array[array.length - 1]更加简洁。
6. 正则匹配的开始和结束索引 (RegExp Match Indices)
用法
通过 d 标志,正则表达式匹配的结果会包含每个捕获组的开始和结束索引。
const regex = /(\d+)/d;
const match = regex.exec('abc123def');
console.log(match.indices); // [[3, 6], [3, 6]]
使用场景
- 当需要获取正则匹配的精确位置时,可以使用
d标志。 - 例如,用于高亮显示匹配的文本或进行复杂的文本处理。
以上是 ES13 中一些新特性的用法总结,这些特性可以帮助开发者编写更加简洁、安全和高效的代码。