blob: 6c4f2c2e1e3375c65fde1b34490390aa1f30011b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
---
title: Logical OR assignment (||=)
slug: Web/JavaScript/Reference/Operators/Logical_OR_assignment
tags:
- JavaScript
- Language feature
- Logical Operator
- Operator
- Reference
translation_of: Web/JavaScript/Reference/Operators/Logical_OR_assignment
---
{{jsSidebar("Operators")}}
逻辑或赋值（`x ||= y`）运算仅在 `x` 为{{Glossary("falsy", "虚")}}值时赋值。
{{EmbedInteractiveExample("pages/js/expressions-logical-or-assignment.html")}}
## 语法
```js
expr1 ||= expr2
```
## 描述
### 短路运算
[逻辑或](/zh-CN/docs/Web/JavaScript/Reference/Operators/Logical_OR)的运算方法如下所示：
```js
x || y;
// 当 x 为真值时，返回 x
// 当 y 为真值时，返回 y
```
逻辑或运算的短路逻辑：当且仅当第一个操作数尚未确定结果（不是真值）时，才会评估第二个操作数。
逻辑或赋值运算有短路逻辑，这意味着，它仅在左侧为虚值时执行赋值。换句话说，`x ||= y` 等同于：
```js
x || (x = y);
```
但不等同于以下总是执行赋值的语句：
```js example-bad
x = x || y;
```
请注意，这与数学逻辑和按位赋值运算不同。
## 示例
### 设定默认值
当“lyrics”元素为空时，则显示默认值：
```js
document.getElementById('lyrics').textContent ||= 'No lyrics.'
```
在这里，短路运算特别有用，因为元素不会产生不必要的更新，也不会引起诸如额外的解析、渲染、失去焦点等副作用。
注意：请注意检查 API 返回的值。如果返回的是空字符串（是{{Glossary("falsy", "虚")}}值），则必须使用 `||=`。在其他情况下（返回值是 {{jsxref("null")}} 或 {{jsxref("undefined")}}），你可以使用 `??=` 运算符。
## 规范
{{Specifications}}
## 浏览器兼容性
{{Compat}}
## 参见
- [逻辑或（||）](/zh-CN/docs/Web/JavaScript/Reference/Operators/Logical_OR)
- [空值合并运算符（`??`）](/zh-CN/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator)
- [按位或赋值（`|=`）](/zh-CN/docs/Web/JavaScript/Reference/Operators/Bitwise_OR_assignment)
- {{Glossary("Truthy")}}
- {{Glossary("Falsy")}}
|
