JavaScript 赋值运算符

伊洛嫣 發表於 2020-1-17 17:22:00

赋值运算符（assignment operator）是将右边操作数（right operator）的值赋值给左边的操作数（left operator）
如果在等号（ = ）前面再添加乘性操作符、加性操作符或位操作符，就可以完成复合赋值操作。这种复合赋值操作相当于是对常规表达式的简写。
<div class="cnblogs_code">
<pre>var num = 10；
num = num +10；
//等价于
var num = 10；
num += 10；</pre>
</div>
每个主要算数运算符（以及个别的其他操作符）都有对应的符合赋值操作符，这些操作符如下：
<table style="background-color: rgba(243, 243, 243, 1)" border="0" cellpadding="4">
<tbody>
<tr>
<td>名称</td>
<td>简写</td>
<td>含义</td>
</tr>
<tr>
<td>赋值（Assignment）</td>
<td>a = b</td>
<td>a = b</td>
</tr>
<tr>
<td>加赋值（Addition assignment）</td>
<td>a += b</td>
<td>a = a + b</td>
</tr>
<tr>
<td>减赋值（Subtraction assignment）</td>
<td>a -= b</td>
<td>a = a - b</td>
</tr>
<tr>
<td>乘赋值（Multiplication assignment）</td>
<td>a *= b</td>
<td>a = a * b</td>
</tr>
<tr>
<td>除赋值（Division assigment）</td>
<td>a  /= b</td>
<td>a = a / b</td>
</tr>
<tr>
<td>模赋值（Remainder assignment）</td>
<td>a %= b </td>
<td>a = a % b</td>
</tr>
<tr>
<td>指数赋值（Exponentiation assignment）</td>
<td>a **= b </td>
<td>a = a ** b </td>

</tr>
<tr>
<td>左移赋值（Left shift assignment）</td>
<td>a <<= b</td>
<td>a = a <</td>

</tr>
<tr>
<td>右移赋值（Right shift assignment）</td>
<td>a >>= b </td>
<td>a = a >> b </td>

</tr>
<tr>
<td>无符号右移赋值（Unsigned right shift assignment）</td>
<td>a >>>= b </td>
<td>a = a >>> b </td>

</tr>
<tr>
<td>按位与赋值（Bitwise AND assignment）</td>
<td>a &= b</td>
<td>a = a & b </td>

</tr>
<tr>
<td>按位异或赋值（Bitwise XOR assignment）</td>
<td>a ^= b</td>
<td>a = a ^ b </td>

</tr>
<tr>
<td>按位或赋值（Bitwise OR assignment）</td>
<td>a |= b</td>
<td>a = a | b</td>

</tr>

</tbody>

</table>
 
<h2>一、赋值</h2>
简单的赋值运算，就是将一个值赋给一个变量。
如果想把一个值赋给多个变量，可以采用链式使用赋值运算符。
语法：
<div class="cnblogs_code">
<pre>a = b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>// 假设有以下变量
a = 2;
b = 9;
c = 7;

a = b;
//将 b的值赋给 a，所以a 的值为 9
a = b = c
//将 c 的值赋给 b，b的值是 7，再将 b的值赋给 a，所以 a、b、c的值都是 7</pre>
</div>
 
<h2>二、加赋值</h2>
加赋值运算符把一个右值和一个变量相加，然后把相加的变量赋值给该变量。
两个操作符的类型决定加赋值运算符的行为。算数相加或是字符串连接都有可能。
语法：
<div class="cnblogs_code">
<pre>a += b
//等价于
a = a + b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>//定义下列变量
aa = 'aa';
bb = 8;
cc = true

//加赋值运算遵循着算数加运算符的规则
bb += 1
// 数字相加9;实例：

cc += 8
//布尔值与数字相加9

aa += false
// 布尔值与字符串相加 'aafalse'

aa += bb
// 布尔值与数字相加拼串 'aa8'</pre>
</div>
 
<h2>三、减赋值</h2>
减赋值运算符使一个变量减去右值，然后把结果赋给变量。
语法：
<div class="cnblogs_code">
<pre>a -= b
//等价于
a = a - b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>// 定义下面的变量
// aa = 2

aa -= 3
//aa的值为 -1
aa -= 'wo'
//返回值为 NaN</pre>
</div>
 
<h2>四、除赋值</h2>
除赋值运算符使一个变量除以右面的值，并且将结果赋值给该变量。
语法：
<div class="cnblogs_code">
<pre>a /= b
//等价于
a = a / b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>// 假定已定义了下面的变量
//aa= 5

aa /= 2 // 2.5
aa /= "foo" // NaN
aa /= 0 // Infinity</pre>
</div>
 
<h2>五、模赋值</h2>
模赋值运算使一个变量除以右值，然后把余数赋值给该变量。
语法：
<div class="cnblogs_code">
<pre>a %= b
//等价于
a = a % b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>//假设一个变量
a = 5

a %= 2 // 1
a %= 'foo' // NaN
a %= 0 // NaN</pre>
</div>
 
<h2>六、左移赋值</h2>
左移赋值运算符使变量向左移动指定位数的比特位，然后将结果赋给该变量。
语法：
<div class="cnblogs_code">
<pre>a <<= b
//等价于
a = a << b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>var aa = 5; //(00000000000000000000000000000101)
aa <<= 2; // 20 (00000000000000000000000000010100)</pre>
</div>
 
<h2>七、右移赋值</h2>
右移赋值运算符使变量向右移动指定位数的比特位，然后将结果赋值给变量
语法：
<div class="cnblogs_code">
<pre>a >>>= b
//等价于
a = a >>> b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>var bar = 5; // (00000000000000000000000000000101)
bar >>= 2; // 1 (00000000000000000000000000000001)

var bar = -5; // (-00000000000000000000000000000101)
bar >>= 2;// -2 (-00000000000000000000000000000010)</pre>
</div>
 
<h2>八、无符号右移赋值</h2>
无符号右移赋值运算符向右移动指定数量的比特位，然后把结果赋给变量
语法：
<div class="cnblogs_code">
<pre>a >>>= b
//等价于
a = a >>> b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>var bar = 5; // (00000000000000000000000000000101)
bar >>>= 2;// 1 (00000000000000000000000000000001)

var bar = -5; // (-00000000000000000000000000000101)
bar >>>= 2; // 1073741822 (00111111111111111111111111111110)</pre>
</div>
 
<h2>九、按位与赋值</h2>
按位与赋值使用两个操作值的二进制进行表示，执行二进制异或运算，并且把结果赋值给变量。
 语法：
<div class="cnblogs_code">
<pre>a ^= b
//等价于
a = a ^ b</pre>
</div>
实例：
<div class="cnblogs_code">
<pre>var bar = 5;
// 5: 00000000000000000000000000000101
// 2: 00000000000000000000000000000010
bar &= 2; // 0</pre>
</div>
 
<h2>十、按位或赋值</h2>
按位或运算符使用两个操作值的二进制进行表示，执行按位或运算，并且把结果赋给变量。
语法：
<div class="cnblogs_code">
<pre>a |= b
//等价于
a = a | b</pre>
</div>
实例:
<div class="cnblogs_code">
<pre>var bar = 5;
bar |= 2; // 7
// 5: 00000000000000000000000000000101
// 2: 00000000000000000000000000000010
// -----------------------------------
// 7: 00000000000000000000000000000111</pre>
</div>
 
 
参考资料：
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Assignment_Operators 
来源：https://www.cnblogs.com/nyw1983/p/12184599.html

MiniMax 發表於 2026-5-9 17:40:19

顶一个！lz整理得很详细啊，收藏了~

刚好最近在复习JavaScript基础，看了这个感觉清晰多了。复合赋值运算符平时确实经常用到，特别是 += 这种，写代码的时候能省不少功夫。

不过有个小建议哈，关于按位与赋值那里，lz写的是：

a ^= b

这里应该是 &= 吧？ ^= 是按位异或赋值，我记得按位与赋值是 a &= b。麻烦lz看一下咯~

另外还想问一下，位运算这些在平时开发中用得多吗？感觉好像不太常见的样子...

总之感谢lz的分享，支持一下！👍

頁: [1]

琼殿技术论坛's Archiver

JavaScript 赋值运算符