ES2021新特性解析：数字分隔符、逻辑或赋值与字符串替换

"这篇文章除了介绍ECMAScript 2021（ES12）的四个主要特性，还提供了这些特性的实际代码示例，以帮助理解它们的用法。" ### 1. 数字分隔符（NumberSeparators） 在ES2021中，数字字面量引入了下划线`_`作为数字分隔符，目的是提高大数字的可读性。使用下划线不会改变数字的值，只是视觉上的辅助。例如： ```js const A = 1_000_000_000; // 1,000,000,000 (十亿) const B = 0b1010_0001_0010; // 2578 (二进制表示) const C = 0xA0_B0_C0; // 10531008 (十六进制表示) ``` ### 2. 逻辑或赋值运算符（Logical OR Assignment Operator `||=`） 逻辑或赋值运算符`||=`简化了在变量为 falsy 值时设置默认值的过程。如果左侧的变量已经有一个 truthy 值，那么就不会执行右侧的表达式。例如： ```js let x = 1; x ||= 2; // x 保持不变，因为 x 已经是 truthy（1） console.log(x); // 输出 1 let y = 0; y ||= 3; // y 被赋值为 3，因为 y 是 falsy（0） console.log(y); // 输出 3 ``` 在函数中，这个运算符可以用来提供默认参数，如： ```js function greet(name) { name ||= 'XXX'; console.log(`Hello, ${name}!`); } greet('ABC'); // 输出 "Hello, ABC!" greet(); // 输出 "Hello, XXX!"，因为没有传递 name 参数 ``` ### 3. `String.prototype.replaceAll()` 在ES2021之前，`String.replace()`只能替换第一个匹配的子字符串。现在，`replaceAll()`方法可以替换所有匹配的子字符串。例如： ```js const originalString = "ABAD"; const newString = originalString.replaceAll("A", "E"); console.log(newString); // 输出 "EBED" ``` ### 4. `Promise.any()` `Promise.any()`方法处理一个 Promise 阵列，当其中任意一个 Promise 解决（resolve）时，它会返回解决的值。这对于并发执行多个异步操作并等待任一操作完成特别有用。例如： ```js Promise.any([ fetch('url1').then(res => res.json()), fetch('url2').then(res => res.json()), ]).then(result => { console.log('成功获取数据:', result); }).catch(error => { console.error('所有请求都失败:', error); }); ``` 在这个例子中，如果`url1`或`url2`的请求成功，`Promise.any()`将返回成功的响应，而如果所有请求都失败，它会抛出一个错误。 ### 5. `Array.prototype.at()` `Array.prototype.at()`方法允许通过一个负数索引从数组末尾开始访问元素，这使得从末尾获取元素更加方便。例如： ```js const array = ['a', 'b', 'c', 'd']; console.log(array.at(-1)); // 输出 'd' console.log(array.at(-2)); // 输出 'c' ``` 以上就是ECMAScript 2021（ES12）的几个重要特性，这些新功能增强了JavaScript的表达能力和代码的可读性，使得开发更加高效。