ECMAScript 12 (ES12, ES2021) 新特性

还是大剑师兰特：曾是美国某知名大学计算机专业研究生，现为航空航海领域高级前端工程师；CSDN知名博主，GIS领域优质创作者，深耕openlayers、leaflet、mapbox、cesium，canvas，webgl，echarts等技术开发，欢迎加底部微信（gis-dajianshi），一起交流。

No.	内容链接
1	Openlayers 【入门教程】 - 【源代码+示例300+】
2	Leaflet 【入门教程】 - 【源代码+图文示例 150+】
3	Cesium 【入门教程】 - 【源代码+图文示例200+】
4	MapboxGL【入门教程】 - 【源代码+图文示例150+】
5	前端就业宝典 【面试题+详细答案 1000+】

---

ECMAScript 12（通常称为ES2021或ES12）是JavaScript语言的一个版本，它在2021年由ECMA国际标准化组织发布。虽然这个版本引入的变化相对较小，但它仍然包含了一些有用的新特性。

新特性概述

1. Promise.any()

Promise.any() 是一个新方法，用于处理多个Promise。如果其中任何一个Promise解析成功，则返回第一个成功的Promise的结果；如果所有的Promise都被拒绝，则返回一个聚合错误。

示例:

const promise1 = Promise.reject(new Error('Fail'));
const promise2 = new Promise((resolve) => setTimeout(resolve, 500, 'Success'));
const promise3 = Promise.reject(new Error('Fail'));

Promise.any([promise1, promise2, promise3])
  .then((value) => console.log(value)) // Logs "Success"
  .catch((error) => console.error(error));

2. String.prototype.replaceAll()

replaceAll() 方法返回一个新的字符串，其中所有匹配给定模式的子串都被替换为指定的替换文本。

示例:

const str = 'hello world';
console.log(str.replaceAll('l', 'L')); // Logs "heLLo worLd"

3. WeakRefs

WeakRef 允许你持有对象的一个弱引用，这意味着当对象不再被任何强引用所引用时，垃圾回收器可以自由地回收该对象。

示例:

class Resource {
  constructor(data) {
    this.data = data;
  }
}

const resource = new Resource('some data');
const weakRef = new WeakRef(resource);
console.log(weakRef.deref()); // Logs the Resource object

// Clearing the strong reference.
resource = null;
// After garbage collection, the weakRef should be null.
setTimeout(() => {
  console.log(weakRef.deref()); // Logs "undefined" if garbage collected
}, 0);

4. Logical Assignment Operators

逻辑赋值运算符允许你使用逻辑AND (&&=) 和 OR (||=) 运算符进行赋值。

示例:

let a = false;
let b = true;

a ||= 1; // a remains false
b ||= 2; // b remains true
a &&= 3; // a remains false
b &&= 4; // b becomes 4

console.log(a); // Logs "false"
console.log(b); // Logs "4"

5. New Methods in RegExp

在正则表达式中添加了新的方法，如 lastIndex 的 setter。

示例:

const re = /./g;
re.lastIndex = 10; // Set lastIndex to 10
console.log(re.lastIndex); // Logs "10"

6. Numeric Separators

数字分隔符 _ 可以用来更清晰地表示大数。

示例:

const largeNumber = 1_000_000;
console.log(largeNumber); // Logs "1000000"