📜  ECMAScript 2021 更新中的新功能

📅  最后修改于: 2022-05-13 01:56:20.650000             🧑  作者: Mango

ECMAScript 2021 更新中的新功能

ECMAScript 是 JavaScript 语言的一部分,主要用于 Web 技术、构建网站或 Web 应用程序。 ECMAScript 正在成长为世界上使用最广泛的通用编程语言之一。它主要用于嵌入网络浏览器,也用于服务器和嵌入式应用程序。

ECMAScript 的新更新将于今年 7 月发布。引入了新的改进以使 JavaScript 更强大,也使开发人员的工作更轻松。它提供了新功能、完成复杂工作的简单方法等等。

新更新: ECMAScript 2021中的 JavaScript 新特性如下:

1. 逻辑赋值运算符:逻辑赋值运算符引入了结合逻辑运算符和赋值表达式的新运算符符。

  • And & Equals (&&=):当值为真时赋值。

    以前的版本:

    let x = 1;
    if(x){
      a = 10;
    }

    输出:

    x = 10

    新版本:

    let x = 1;
    x &&= 10;

    输出:

    x = 10
  • OR & Equals (||=):当值为假时赋值。只有当 x 是一个假值时,才会发生赋值操作。如果 x 包含 1 这是一个真值,则不会发生赋值。这里 x 包含 0 因此分配发生。

    以前的版本:

    let x = 0;
    x = x || 10;

    输出:

    x = 10

    新版本:

    let x = 0;
    x ||= 10

    输出:

    x = 10
  • 空值合并 & 等于 (??=):符号 ??是 JavaScript 中的空值合并运算符。它检查一个值是否为空或未定义。
    let x;
    let y = 10;
    x ??= y;
    console.log(x);
    console.log(y);

    输出: x 的值未定义,因此计算右侧表达式并将 x 设置为 10。

    10
    10

2. 数字分隔符:为了提高可读性和分隔数字组,数字字面量使用下划线作为分隔符。

// A billion dollar that I want to earn
const money = 1_000_000_000;

const money = 1_000_000_000.00;

它也可用于二进制、十六进制、八进制碱基。

3. String replaceAll() 如果我们想替换字符串中子字符串的所有实例,那么这个新方法replaceAll()非常有用。

const s = "You are reading JavaScript 2021 new updates.";
console.log(s.replaceAll("JavaScript", "ECMAScript"));

输出 :

You are reading ECMAScript 2021 new updates.

4. Promise.any: Promise.any()方法返回一个 Promise,只要其中一个 Promise 被解决,该 Promise 就会被解决。它是相反的 Promise.all()方法,它在解决之前等待所有 Promise 解决。

当所有的 Promise 都被拒绝时会发生什么,该方法会抛出一个带有拒绝原因的AggregateError异常。我们在 try-catch 块中编写了代码。

const promiseOne = new Promise((resolve, reject) => {
  setTimeout(() => reject(), 1000);
});

const promiseTwo = new Promise((resolve, reject) => {
  setTimeout(() => reject(), 2000);
});

const promiseThree = new Promise((resolve, reject) => {
  setTimeout(() => reject(), 3000);
});

try {
  const first = await Promise.any([
    promiseOne, promiseTwo, promiseThree
  ]);
  // If any of the promises was satisfied.
} catch (error) {
  console.log(error);
  // AggregateError: If all promises were rejected
}

输出:

await is only valid in async functions and the top-level bodies of modules

5.私有类方法:私有方法只在类内部有作用域,所以在类外部是不可访问的。

以前的版本:

class GfG {
  showMe() {
    console.log("I am a geek")
  }
  #notShowMe() {
    console.log("Hidden informations")
  }
}

const gfg = new GfG()

gfg.showMe()
gfg.notShowMe() 

输出:错误如下所示。这是因为notShowMe()现在是 GfG 类中的私有方法,只能通过类中的公共方法访问。

gfg.notShowMe is not a function

新版本:

class GfG {
  showMe() {
    console.log("I am a geek");
  }
  #notShowMe() {
    console.log("Hidden informations");
  }
  showAll() {
    this.showMe()
    this.#notShowMe();
  }
}

const gfg = new GfG();
gfg.showAll();

输出:我们在类 GfG 中创建了一个名为showAll()的新公共方法。从这个公共方法,我们可以访问私有方法#notShowMe() ,由于我们的新方法是公共的,我们得到以下结果。

I am a geek
Hidden informations

6. Private Getter 和 Setter:就像 private 方法,现在我们可以制作 getter 和 setter 以便它们只能在类内部或通过创建的实例访问。

class GfG {
  get #Name() {
    return "GeeksforGeeks"
  }
  
  get viewName() {
    return this.#Name
  }
}

let name = new GfG();
console.log(name.viewName);

输出:

GeeksforGeeks