ES11 年度最新基础特性整理、ES12 已来-JavaScript中文网-JavaScript教程资源分享门户

ES11 已经发布了！在这个新版本中，有一些非常实用的特性被添加进了语言中。同时，我们也已经可以着手关注 ES12 将要提供的功能了。在这篇文章中，我们将会对 ES11 和 ES12 中的一些新特性进行详细讲解，并给出一些示例代码，帮助你更好地理解这些新特性。

ES11 中的新特性

以下是 ES11 中的一些新特性：

1. 空值合并运算符 `??`

?? 运算符允许我们在一个表达式中对空值进行默认值设置。我们可以使用 ?? 运算符来判断某个值是否为 null 或 undefined，然后设置一个默认值。

// 设置默认值
const defaultValue = 'hello world';
const value = null;

console.log(value ?? defaultValue); // 输出 ‘hello world’

2. Optional chaining - 可选链式调用

可选链式调用（?.）允许我们在安全调用不存在对象的属性或方法时，免于使用大量的 if 判断或者 try-catch 代码。

const obj = { a: { b: { c: 123 } } };
console.log(obj?.a?.b?.c); // 输出 123

const obj2 = {};
console.log(obj2?.a?.b?.c); // 输出 undefined

3. 字符串类型的 matchAll 方法

matchAll 方法能够返回一个正则表达式的所有匹配项及其捕获组。

const regex = /t(e)(st(\d?))/g;
const str = 'test1test2test3';

const matches = str.matchAll(regex);

for (const match of matches) {
  console.log(match);
}

4. Promise.allSettled 方法

allSettled 方法等待所有 Promise 对象 settled（已解决）之后再返回。其返回值是一个带有 Promise 结果的对象数组，而不是 Promise 结果的数组。

-- -------------------- ---- -------
----- -------- - -
  -----------------------------
  ----------------------------
  ------------------------- --------
--

----------------------------
  --------------- -- -
    ---------------------
    --
      -
        - ------- ------------ ------ ----------- --
        - ------- ----------- ------- ----------- --
        - ------- ------------ ------ --------- ------- -
      -
    --
  ---

ES12 将要提供的新特性

除了 ES11 中推出的新特性，我们也需要注意 ES12 中将要推出的一些新特性。以下是一些 ES12 中的新功能：

1. `import()` 动态导入

在 ES12 中，你可以使用 import() 方法来动态的导入模块。

import(`./modules/${someModule}.js`)
  .then((module) => {
    module.doSomething();
  });

2. Private 类字段和方法

ES12 支持类内部的私有字段和方法。在私有属性和方法上使用# 来标识。

-- -------------------- ---- -------
----- ------- -
  ------------- - --------
  
  --- -------------- -
    ------ -------------------
  -
  
  --- ---------------------- -
    ------------------ - ---------
  -
  
  ---------------- -
    -------------- -- - ------- ----------
  -
  
  -------------- -
    -------------- -- - ------ ----------
    ----------------------
  -
-

----- -------- - --- ----------
----------------------------------- -- -- -------
--------------------- - --------
----------------------------------- -- -- -------
------------------------ -- -- -- -- - ------ -------- - -- -- - ------- --------

3. 逻辑赋值运算符

ES12 中添加的逻辑赋值运算符，包括：&&=、||=、??=。

let x = 1;
x &&= 2; // 将 x 的值设为 2，因为 1 && 2 为 true
console.log(x); // 输出 2

let y = null;
y ||= 'new';
console.log(y); // 输出 'new'

4. WeakRefs 弱引用

ES12 中添加了一种新的引用类型，称为 WeakRefs，可以更好地管理内存空间。WeakRefs 引用的对象只要对象被垃圾回收器回收，WeakRefs 引用也会随之消失。

let target = {};
let weakRef = new WeakRef(target);
target = null;

// 下面一行输出 undefined，即目标已经不存在，weakRef 也不存在
console.log(weakRef.deref());

总结

在本文中，我们详细地讲解了 ES11 和将要推出的 ES12 中的一些新特性。这些新特性可以帮助我们更好地编写 JavaScript 代码，并且这些特性都是语言中不可或缺的基本功能。希望这篇文章对你有所帮助，并且可以让你更好地了解 JavaScript 中的最新开发进展。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/64a7a6a348841e98944233e5

ES11 年度最新基础特性整理、ES12 已来