ECMAScript 2021（ES12）中新增的逻辑赋值运算符及其使用场景-JavaScript中文网-JavaScript教程资源分享门户

随着 ECMAScript 2021（ES12）的发布，JavaScript 语言又迎来了一些新特性。其中，新增的逻辑赋值运算符是一个非常实用的新特性，它能够简化我们平时编写代码的过程，提高我们的编程效率。在本文中，我们将介绍逻辑赋值运算符的使用场景，并通过实例代码来演示如何使用这些新特性。

逻辑赋值运算符

在 ECMAScript 2021 中，我们可以使用三种逻辑赋值运算符：

这些运算符结合了运算符和赋值操作，能够更加简洁地实现常见的逻辑操作。在下面的例子中，我们将分别介绍这三种逻辑赋值运算符的使用方法。

||= 运算符用于判断变量是否为 undefined 或 null，如果是，则将其赋值为指定的值。下面的代码演示了如何使用 ||= 运算符：

let a; 
a ||= 'hello'; 
console.log(a); // 输出 "hello" 

let b = 'world'; 
b ||= 'hello'; 
console.log(b); // 输出 "world"

在上面的例子中，变量 a 最初未定义，因此 a ||= 'hello' 实际上等同于 a = a || 'hello'。第二个例子中，变量 b 已经存在，因此 b ||= 'hello' 将不会修改 b 的值。

&&= 运算符可以用来判断某个变量是否已经定义，如果已经定义，则将其赋值为指定的值。下面的代码演示了如何使用 &&= 运算符：

let c;
c &&= 'hello';
console.log(c); // 输出 undefined 

let d = 'world';
d &&= 'hello';
console.log(d); // 输出 "hello"

在上面的例子中，变量 c 最初未定义，因此 c &&= 'hello' 将返回 undefined。因为 && 运算符的第一个参数未定义，所以整个表达式的结果已经确定。在第二个例子中，变量 d 已经存在，因此 d &&= 'hello' 将会将 d 的值修改为 'hello'。

??= 运算符与 ||= 运算符类似，但是它只会在变量为 null 或 undefined 时进行赋值。下面的代码演示了如何使用 ??= 运算符：

let e;
e ??= 'hello';
console.log(e); // 输出 "hello"

let f = null;
f ??= 'world';
console.log(f); // 输出 null

在上面的例子中，变量 e 最初未定义，因此 e ??= 'hello' 将返回 'hello'。在第二个例子中，变量 f 已经被赋值为 null，因此 f ??= 'world' 将不会修改 f 的值。

逻辑赋值运算符是 ECMAScript 2021（ES12）中的一项新特性，它能够简化我们平时编写代码的过程，提高我们的编程效率。在本文中，我们介绍了三种逻辑赋值运算符的使用方法，并通过实例代码演示了它们的具体应用场景。我们希望本文能够为大家带来一些帮助，让大家更好地了解并使用逻辑赋值运算符。

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