JavaScript - 賦值運算子



JavaScript 賦值運算子

JavaScript 中的賦值運算子用於將值賦給變數。這些是二元運算子。賦值運算符采用兩個運算元,根據運算元的值將值賦給運算元。運算元始終是一個變數,而右運算元可以是字面量、變數或表示式。

let x = 10; // right operand is a literal
let y = x; // right operand is a variable
let z = x + 10; // right operand is an expression

賦值運算子首先計算表示式,然後將值賦給變數(左運算元)。

一個簡單的賦值運算子是等於(=)運算子。在 JavaScript 語句“let x = 10;”中,= 運算子將 10 賦給變數 x。

我們可以將簡單的賦值運算子與其他型別的運算子(如算術運算子、邏輯運算子等)結合起來,以獲得複合賦值運算子。一些算術賦值運算子有 +=、-=、*=、/= 等。+= 運算子對運算元執行加法運算,並將結果賦給左運算元。

算術賦值運算子

在本節中,我們將介紹簡單賦值和算術賦值運算子。算術賦值運算子執行算術運算並將結果賦給一個變數。以下是運算子列表及其示例 -

賦值運算子 示例 等價於
= (賦值) a = b a = b
+= (加法賦值) a += b a = a + b
-= (減法賦值) a -= b a = a – b
*= (乘法賦值) a *= b a = a * b
/= (除法賦值) a /= b a = a / b
%= (取餘賦值) a %= b a = a % b
**= (指數賦值) a **= b a = a ** b

簡單賦值 (=) 運算子

簡單賦值 (=) 運算子將值賦給變數。我們可以將單個值賦給多個變數。這稱為賦值鏈。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 5;
    let y = x + 10; 
    document.getElementById("output").innerHTML = 
    "Value of x : " + x + "<br>" +
    "Value of y : " + y;
  </script>
</body>
</html>

以下是賦值鏈的示例 -

<html>
<body>
  <div id="output"></div>
  <script>
    let x = y = 5;
    document.getElementById("output").innerHTML = 
    "Value of x : " + x + "<br>" +
    "Value of y : " + y;
  </script>
</body>
</html>

加法賦值 (+=) 運算子

JavaScript 加法賦值運算子對兩個運算元執行加法運算,並將結果賦給左運算元。這裡的加法可以是數字加法或字串連線。

x += b;

在上述語句中,它將 b 和 x 的值相加並將結果賦給 x。

示例:數字加法賦值

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 5;
    x += 7;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

示例:字串連線賦值

<html>
<body>
  <div id="output"></div>
  <script>
    let x ="Hello";
    x += " World";
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

減法賦值 (-=) 運算子

JavaScript 中的減法賦值運算子從左運算元中減去右運算元的值,並將結果賦給左運算元(變數)。

let x -=b;

在上述語句中,它從 x 中減去 b 並將結果賦給 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 15;
    x -= 5;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

乘法賦值 (*=) 運算子

JavaScript 中的乘法賦值運算子將兩個運算元相乘並將結果賦給左運算元。

let x *= b;

在上述語句中,它將 x 和 b 相乘並將結果賦給 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 10;
	x *= 5;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

除法賦值 (/=) 運算子

此運算子將左運算元除以右運算元並將結果賦給左運算元。

let x /= b;

在上述語句中,它將 x 除以 b 並將結果(商)賦給 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 10;
    x /= 5;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

取餘賦值 (%=) 運算子

JavaScript 取餘賦值運算子對運算元執行取餘運算並將結果賦給左運算元。

let x %= b;

在上述語句中,它將 x 除以 b 並將結果(餘數)賦給 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 12;
    x %= 5;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

指數賦值 (**=) 運算子

此運算子對運算元執行指數運算並將結果賦給左運算元。

let x **= b;

在上述語句中,它計算 x**b 並將結果賦給 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 5;
    x **= 3;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

JavaScript 按位賦值運算子

按位賦值運算子對運算元執行按位運算並將結果賦給一個變數。這些運算執行兩個操作,首先是按位運算,然後是簡單的賦值運算。按位運算是在位級別上執行的。按位運算子將兩個運算元都視為 32 位有符號整數,並在運算元的對應位上執行運算。簡單的賦值運算子將結果賦給變數(左運算元)。

以下是運算子列表及其示例 -

賦值運算子 示例 等價於
&= (按位與賦值) a &= b a = a & b
|= (按位或賦值) a |= b a = a | b
^= (按位異或賦值) a ^= b a = a ^ b

按位與賦值運算子

JavaScript 按位與賦值 (&=) 運算子對運算元執行按位與運算並將結果賦給左運算元(變數)。

let x &= b;

在上述語句中,它對 x 和 b 執行按位與運算,並將結果賦值給變數 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 7; 
    x &= 5;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

按位或賦值運算子

JavaScript 按位或賦值運算子(|=)對運算元執行按位或運算,並將結果賦值給左運算元(變數)。

let x |= b;

在上述語句中,它對 x 和 b 執行按位或運算,並將結果賦值給變數 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 7; 
    x |= 5;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

按位異或賦值運算子

JavaScript 按位異或賦值運算子 (^=) 對運算元執行按位異或運算,並將結果賦值給左運算元(變數)。

let x ^= b;

在上述語句中,它對 x 和 b 執行按位異或運算,並將結果賦值給變數 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 7; 
    x ^= 5;
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

JavaScript 移位賦值運算子

移位賦值運算子對運算元執行按位移位運算,並將結果賦值給變數(左運算元)。它們是兩個運算子的組合,第一個是按位移位運算子,第二個是簡單的賦值運算子。

以下是移位賦值運算子及其示例的列表:

賦值運算子 示例 等價於
<<=(左移賦值) a <<= b a = a << b
>>=(右移賦值) a >>= b a = a >> b
>>>=(無符號右移賦值) a >>>= b a = a >>> b

左移賦值運算子

JavaScript 左移賦值運算子 (<<=) 對運算元執行左移運算,並將結果賦值給左運算元(變數)。

let x <<= b;

在上述語句中,它對 x 和 b 執行左移運算,並將結果賦值給變數 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 7; 
    x <<= 2; 
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

右移賦值運算子

JavaScript 右移賦值運算子 (>>=) 對運算元執行右移運算,並將結果賦值給左運算元(變數)。

let x >>= b;

在上述語句中,它對 x 和 b 執行右移運算,並將結果賦值給變數 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 7; 
	x >>= 1; 
    document.getElementById("output").innerHTML = "Value of x : " + x;
  </script>
</body>
</html>

無符號右移賦值運算子

JavaScript 無符號右移賦值運算子 (>>>=) 對運算元執行無符號右移運算,並將結果賦值給左運算元(變數)。

let x >>>= b;

在上述語句中,它對 x 和 b 執行無符號右移運算,並將結果賦值給變數 x。

<html>
<body>
  <div id="output"></div>
  <script>
    let x = 7; 
    x >>>= 2;
    document.getElementById("output").innerHTML ="Value of x : " + x;
  </script>
</body>
</html>

JavaScript 邏輯賦值運算子

在 JavaScript 中,邏輯賦值運算子對運算元執行邏輯運算,並將結果賦值給變數(左運算元)。每個邏輯賦值運算子都是兩個運算子的組合,第一個是邏輯運算子,第二個是簡單的賦值運算子。

以下是邏輯賦值運算子及其示例的列表:

賦值運算子 示例 等價於
&&=(邏輯與賦值) a &&= b a = a && b
||=(邏輯或賦值) a ||= b a = a || b
??=(空值合併賦值) a ??= b a = a ?? b

示例

<html>
<body>
  <div id="output"></div>
  <script>
    var a = 5;
    var b = 10;
    var result = (a &&= b);
    document.getElementById("output").innerHTML = 
	"Value of (a &&= b) => " + result + "<br/>";
    result = (a ||= b);
    document.getElementById("output").innerHTML +=
	"Value of (a ||= b) => " + result;
  </script>
</body>
</html>
廣告