与许多其他编程语言一样,JavaScript 也在不断发展,每年,蓝狮注册登陆该语言都会通过新功能变得更强大,让开发人员编写更具表现力和简洁的代码。
让我们探索 ECMAScript 2022 (ES13) 中添加的最新功能,并查看它们的使用示例以便我们更好地理解它们。
1、类字段声明
在 ES13 之前,类字段只能在构造函数中声明,与许多其他语言不同,我们不能在类的最外层范围内声明或定义它们。
class Car {
constructor() {
this.color = ‘blue’;
this.age = 2;
}
}
const car = new Car();
console.log(car.color); // blue
console.log(car.age); // 2
ES13 消除了这个限制,现在我们可以编写如下代码:
class Car {
color = ‘blue’;
age = 2;
}
const car = new Car();
console.log(car.color); // blue
console.log(car.age); // 2
2、私有方法和字段
以前,不能在类中声明私有成员,成员通常以下划线 (_) 为前缀,表示它是私有的,但仍然可以从类外部访问和修改。
class Person {
_firstName = ‘Joseph’;
_lastName = ‘Stevens’;
get name() {
return ${this._firstName} ${this._lastName}
;
}
}
const person = new Person();
console.log(person.name); // Joseph Stevens
// Members intended to be private can still be accessed
// from outside the class
console.log(person._firstName); // Joseph
console.log(person._lastName); // Stevens
// They can also be modified
person._firstName = ‘Robert’;
person._lastName = ‘Becker’;
console.log(person.name); // Robert Becker
使用 ES13,我们现在可以将私有字段和成员添加到类中,方法是在其前面加上井号 (#),试图从类外部访问它们会导致错误:
class Person {
#firstName = ‘Joseph’;
#lastName = ‘Stevens’;
get name() {
return ${this.#firstName} ${this.#lastName}
;
}
}
const person = new Person();
console.log(person.name);
// SyntaxError: Private field ‘#firstName’ must be
// declared in an enclosing class
console.log(person.#firstName);
console.log(person.#lastName);
请注意,这里抛出的错误是语法错误,蓝狮官网发生在编译时,因此没有部分代码运行,编译器甚至不希望您尝试从类外部访问私有字段,因此,它假定您正在尝试声明一个。
3、await运算符
在 JavaScript 中,await 运算符用于暂停执行,直到 Promise 被解决(履行或拒绝)。
以前,我们只能在 async 函数中使用此运算符 – 使用 async 关键字声明的函数。我们无法在全球范围内这样做。
function setTimeoutAsync(timeout) {
return new Promise((resolve) => {
setTimeout(() => {
resolve();
}, timeout);
});
}
// SyntaxError: await is only valid in async functions
await setTimeoutAsync(3000);
使用 ES13,现在我们可以:
function setTimeoutAsync(timeout) {
return new Promise((resolve) => {
setTimeout(() => {
resolve();
}, timeout);
});
}
// Waits for timeout – no error thrown
await setTimeoutAsync(3000);
4、静态类字段和静态私有方法
我们现在可以在 ES13 中为类声明静态字段和静态私有方法,静态方法可以使用 this 关键字访问类中的其他私有/公共静态成员,实例方法可以使用 this.constructor 访问它们。
0 Comments