JavaScript - 比較運算子

你好，未來的 JavaScript 巫師們！今天，我們將要深入探索比較運算子的神奇世界。別擔心如果你之前從未寫過一行代碼——我將成為你這次興奮旅程中的友好導遊。所以，拿起你的魔杖（我的意思是，鍵盤），我們來開始吧！

JavaScript - Comparison Operators

JavaScript 比較運算子

比較運算子就像是編程世界的裁判。它們查看兩個值，並決定它們之間的關係。它們是否相等？一個是否大於另一個？這些運算子幫助我們在代碼中做出決策，就像我們在現實生活中做出決策一樣。

讓我們看看今天我們將要介紹的所有比較運算子：

運算子	名稱	示例
==	相等	x == y
!=	不相等	x != y
===	嚴格相等	x === y
!==	嚴格不相等	x !== y
>	大於	x > y
>=	大於或等於	x >= y
<	小於	x < y
<=	小於或等於	x <= y

如何進行比較？

在我們深入每個運算子之前，讓我們先了解 JavaScript 如何比較值。這跟我們在現實生活中比較事物的方式並沒有太大差別！

如果我們比較數字，這很直接。JavaScript 檢查哪個數字更大。
對於字符串，JavaScript 會根據他們的 Unicode 值逐字元比較。
如果我們比較不同的類型（例如數字和字符串），JavaScript 通常會嘗試在比較之前將一種類型轉換為另一種類型。

現在，讓我們詳細看看每個運算子。

JavaScript 相等 (==) 運算子

相等運算子 (==) 檢查兩個值是否相等，但它有點靈活。它可以在比較之前轉換類型。讓我們看一些例子：

console.log(5 == 5);     // true
console.log(5 == "5");   // true
console.log(true == 1);  // true
console.log(null == undefined);  // true

在第一個例子中，我們得到 true 這很明顯。在第二個例子中，JavaScript 將字符串 "5" 轉換為數字再進行比較。第三個例子可能會讓你吃驚——JavaScript 認為 true 等於 1，而 false 等於 0。最後一個例子顯示 null 和 undefined 在 == 運算子中被認為是相等的。

JavaScript 不相等 (!=) 運算子

不相等運算子 (!=) 是 == 的相反。它檢查兩個值是否不相等。

console.log(5 != 6);     // true
console.log(5 != "5");   // false
console.log(true != 1);  // false

就像 == 一樣，它在比較之前也會進行類型轉換。

JavaScript 嚴格相等 (===) 運算子

現在，讓我們認識嚴格相等運算子 (===)。這個運算子就像是 == 運算子的嚴格的哥哥。它不僅檢查值，還確保類型相同。

console.log(5 === 5);     // true
console.log(5 === "5");   // false
console.log(true === 1);  // false
console.log(null === undefined);  // false

看看結果與 == 有什麼不同？嚴格相等運算子不進行任何類型轉換。

嚴格不相等 (!==) 運算子

嚴格不相等運算子 (!==) 是 === 的相反。它檢查兩個值在值或類型上是否不相等。

console.log(5 !== 6);     // true
console.log(5 !== "5");   // true
console.log(true !== 1);  // true

JavaScript 大於 (>) 運算子

大於運算子 (>) 檢查左邊的值是否大於右邊的值。

console.log(10 > 5);   // true
console.log(5 > 10);   // false
console.log(10 > 10);  // false
console.log("b" > "a");  // true (根據 Unicode 值比較)

記住，當比較字符串時，它是基於他們的 Unicode 值，而不是他們的字母順序！

大於或等於 (>=) 運算子

大於或等於運算子 (>=) 檢查左邊的值是否大於或等於右邊的值。

console.log(10 >= 5);   // true
console.log(10 >= 10);  // true
console.log(5 >= 10);   // false

JavaScript 小於 (<) 運算子

小於運算子 (<) 檢查左邊的值是否小於右邊的值。

console.log(5 < 10);   // true
console.log(10 < 5);   // false
console.log(10 < 10);  // false

小於或等於 (<=) 運算子

小於或等於運算子 (<=) 檢查左邊的值是否小於或等於右邊的值。

console.log(5 <= 10);   // true
console.log(10 <= 10);  // true
console.log(10 <= 5);   // false

比較 null、undefined 和 NaN

比較特殊值如 null、undefined 和 NaN 可能會有點棘手。讓我們看一些例子：

console.log(null == undefined);  // true
console.log(null === undefined);  // false
console.log(NaN == NaN);  // false
console.log(NaN === NaN);  // false
console.log(null > 0);  // false
console.log(null == 0);  // false
console.log(null >= 0);  // true

null 和 undefined 的行為可能會讓人吃驚。NaN 不等於任何東西，甚至不等於它自己！而 null 在比較時會被轉換為 0，但在相等性檢查中則不會。

好了，各位！我們已經穿越了 JavaScript 比較運算子的領地。記住，熟練來自練習，所以不要害怕在你自己的代碼中試驗這些運算子。快樂編程！

Credits: Image by storyset