在本教程中,您将学习如何使用 JavaScript 赋值运算符为变量赋值

在本教程中,您将学习如何使用 JavaScript 赋值运算符为变量赋值。
JavaScript 赋值运算符简介
赋值运算符 =
为变量赋值。赋值运算符的语法形式是 let a = b;
。在此语法中,JavaScript 首先计算表达式 b
并将结果分配给变量 a
。
以下示例声明 counter
变量并将其值初始化为零:
let counter = 0;
以下示例将 counter
变量加一并将结果分配给counter
变量:
let counter = 0; counter = counter + 1;
在评估第二条语句时,JavaScript 首先评估右侧的表达式 counter + 1
并将结果分配给 counter
变量。第二次赋值后,counter
变量为 1
。
为了使代码更简洁,您可以像这样使用运算符 +=
:
let counter = 0; counter += 1;
在此语法中,您不必在赋值中重复编写变量 counter
两次。
Operator | Meaning | Description |
---|---|---|
a = b |
a = b |
Assigns the value of b to a . |
a += b |
a = a + b |
Assigns the result of a plus b to a . |
a -= b |
a = a - b |
Assigns the result of a minus b to a . |
a *= b |
a = a * b |
Assigns the result of a times b to a . |
a /= b |
a = a / b |
Assigns the result of a divided by b to a . |
a %= b |
a = a % b |
Assigns the result of a modulo b to a . |
a &=b |
a = a & b |
Assigns the result of a AND b to a . |
a |=b |
a = a | b |
Assigns the result of a OR b to a . |
a ^=b |
a = a ^ b |
Assigns the result of a XOR b to a . |
a <<= b |
a = a << b |
Assigns the result of a shifted left by b to a . |
a >>= b |
a = a >> b |
Assigns the result of a shifted right (sign preserved) by b to a . |
a >>>= b |
a = a >>> b |
Assigns the result of a shifted right by b to a . |
赋值(Assignment)运算符
需要注意,赋值符号 =
也是一个运算符。在优先级表中,它的优先级非常低,为 2。
这就是为什么在我们进行赋值时,比如 x = 2 * 2 + 1
,表达式中的计算会先执行,然后才执行赋值 =
,将结果存储到变量 x
中。
let x = 2 * 2 + 1; alert( x ); // 5
赋值 =
会返回一个值
赋值符号 =
是一个运算符。在 JavaScript 中,所有运算符都会返回一个值。这对 +
和 -
来说显而易见,但对 =
也是如此。
表达式 x = value
会将值写入 x
,然后返回该值。
下面是一个将赋值作为复杂表达式一部分的示例:
let a = 1; let b = 2; let c = 3 - (a = b + 1); alert( a ); // 3 alert( c ); // 0
在上面的示例中,表达式 (a = b + 1)
的结果是赋给 a
的值(也就是 3
)。这个值随后被用于后续的计算。
挺有趣的代码,不是吗?我们应该理解它是如何工作的,因为在一些 JavaScript 库中确实会看到这种写法。
不过,请不要自己写这种代码。这种“技巧”并不会让代码更清晰或者更易读。
链式赋值(Chaining assignments)
另一个有趣的特性是可以进行链式赋值:
let a, b, c; a = b = c = 2 + 2; alert( a ); // 4 alert( b ); // 4 alert( c ); // 4
链式赋值是从右向左进行求值的。首先,最右侧的表达式 2 + 2
被计算出来,然后这个值依次赋给左边的变量:c
、b
和 a
。最终,所有变量拥有相同的值。
不过,为了代码的可读性,最好将这样的代码拆分成几行:
c = 2 + 2; b = c; a = c;
这样更易于阅读,尤其是在快速浏览代码时。
就地修改(Modify-in-place)
我们经常需要对一个变量应用某个运算符,并将新的结果存回这个变量本身。
let n = 2; n = n + 5; n = n * 2;
这种写法可以通过运算符 +=
和 *=
等进行简化:
let n = 2; n += 5; // now n = 7 (same as n = n + 5) n *= 2; // now n = 14 (same as n = n * 2) alert( n ); // 14
几乎所有算术和位运算符都有对应的简写“修改并赋值”运算符,如:/=
、-=
等。
这类运算符的优先级与普通赋值运算符相同,因此它们在大多数其他运算之后执行:
let n = 2; n *= 3 + 5; // right part evaluated first, same as n *= 8 alert( n ); // 16
但是还有一些更复杂的类型,它们提供了有用的快捷方式,可以使你的代码更加清洁和高效。最常见的如下:
运算符 | 名称 | 作用 | 示例 | 等价于 |
---|---|---|---|---|
+= |
加法赋值 | 右边的数值加上左边的变量,然后再返回新的变量。 | x = 3; x += 4; |
x = 3; x = x + 4; |
-= |
减法赋值 | 左边的变量减去右边的数值,然后再返回新的变量。 | x = 6; x -= 3; |
x = 6; x = x - 3; |
*= |
乘法赋值 | 左边的变量乘以右边的数值,然后再返回新的变量。 | x = 2; x *= 3; |
x = 2; x = x * 3; |
/= |
除法赋值 | 左边的变量除以右边的数值,然后再返回新的变量。 | x = 10; x /= 5; |
x = 10; x = x / 5; |
结论