ES12 (ECMAScript 2021) 是 JavaScript 语言的最新版本，其中引入了一些新的操作符，包括逻辑空值合并操作符（nullish coalescing operator）、可选链操作符（optional chaining operator）和 Promise.allSettled 操作符等。这些新操作符可以使代码更加简洁和易于阅读，同时也提高了开发效率。在本文中，我们将分析这些新操作符的实现方式，并提供一些示例代码。
逻辑空值合并操作符
逻辑空值合并操作符（??）用于判断一个变量是否为 null 或 undefined，如果是，则返回默认值。它的语法如下：
const result = variable ?? defaultValue;
其中，result 表示返回的结果，variable 表示需要判断的变量，defaultValue 表示默认值。
在实现上，逻辑空值合并操作符会先判断 variable 是否为 null 或 undefined，如果是，则返回 defaultValue，否则返回 variable 的值。下面是一个示例代码：
const name = undefined; const result = name ?? 'John'; console.log(result); // 输出 'John'
在这个示例中，由于 name 的值为 undefined，所以 result 的值为 'John'。
可选链操作符
可选链操作符（?.）用于判断一个对象是否存在某个属性或方法，如果存在，则返回其值或执行结果，否则返回 undefined。它的语法如下：
const result = object?.property?.method();
其中，result 表示返回的结果，object 表示需要判断的对象，property 表示对象的属性，method 表示属性的方法。
在实现上，可选链操作符会先判断 object 是否存在，如果存在，则继续判断 property 是否存在，如果存在，则继续判断 method 是否存在，如果存在，则执行 method 方法，否则返回 undefined。下面是一个示例代码：
const person = {
name: 'John',
address: {
city: 'New York'
}
};
const result = person?.address?.city;
console.log(result); // 输出 'New York'在这个示例中，由于 person 对象存在 address 属性，因此可以通过可选链操作符获取到 address 的值，进而获取到 city 的值。
Promise.allSettled 操作符
Promise.allSettled 操作符用于处理多个 Promise 对象，并返回一个包含所有 Promise 对象状态的数组。它的语法如下：
const result = Promise.allSettled(promises);
其中，result 表示返回的结果，promises 是一个包含多个 Promise 对象的数组。
在实现上，Promise.allSettled 操作符会同时处理所有 Promise 对象，并返回一个包含所有 Promise 对象状态的数组。下面是一个示例代码：
const promise1 = Promise.resolve(1);
const promise2 = Promise.reject('error');
const promise3 = Promise.resolve(3);
const result = Promise.allSettled([promise1, promise2, promise3]);
console.log(result);在这个示例中，由于 promise2 对象被 reject，因此 result 数组中包含了 promise2 的状态和原因，其他 Promise 对象的状态和值也被包含在了 result 数组中。
总结
ES12 新操作符的实现方式可以使代码更加简洁和易于阅读，同时也提高了开发效率。逻辑空值合并操作符用于判断一个变量是否为 null 或 undefined，可选链操作符用于判断一个对象是否存在某个属性或方法，Promise.allSettled 操作符用于处理多个 Promise 对象。在实际开发中，我们可以根据实际需求选择使用这些新操作符，以提高代码的可读性和开发效率。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65867b2dd2f5e1655d0eefe1