掌握 JavaScript 中的邏輯運算子：`||`、`&&` 和 `!`

在本部落格中，我們將探索JavaScript 中的邏輯運算子：|| (OR)、&& (AND) 和！ （不是）。這些運算符對於建立複雜條件和控製程式流程至關重要。讓我們潛入吧！

邏輯運算子 || （或）

|| 運算子傳回它遇到的第一個真值。如果所有值都是假的，則傳回最後一個值。

文法：

result = value1 || value2 || value3;

範例：

let a = false;
let b = null;
let c = "Hello";

let result = a || b || c;
console.log(result); // Output: "Hello"

說明：

• a 是 假 （假）。
• b 為 null （假）。
• c 是「你好」 （真實）。

|| 運算子傳回第一個真值，即 "Hello".

邏輯運算子 && (AND)

&& 運算子傳回它遇到的第一個假值。如果所有值均為真，則傳回最後一個值。

文法：

result = value1 && value2 && value3;

範例：

let x = true;
let y = 10;
let z = 0;

let result = x && y && z;
console.log(result); // Output: 0

說明：

• x 為 true （真實）。
• y 是 10 （真實）。
• z 是 0 （假）。

&& 運算子傳回第一個假值，即 0.

邏輯運算子！ （不是）

! 運算子傳回其運算元相反的布林值。

文法：

result = !value;

範例：

let isTrue = true;
let isFalse = !isTrue;

console.log(isFalse); // Output: false

說明：

• 為真 為真。
• !isTrue 回傳false。

實際範例

讓我們用一些實際範例將所有內容放在一起：

使用|| 對於預設值

function greet(name) {
  name = name || "Guest";
  console.log("Hello, " + name + "!");
}

greet("Alice"); // Output: Hello, Alice!
greet(); // Output: Hello, Guest!

說明：

• 如果未提供名稱，則||運算子會指派預設值「Guest」。

使用 && 進行條件執行

let user = {
  name: "John",
  age: 25,
  isAdmin: true
};

if (user.isAdmin && user.age > 18) {
  console.log("Welcome, Admin!");
} else {
  console.log("Welcome, User!");
}

說明：

• && 運算子檢查兩個條件（user.isAdmin 和 user.age > 18）是否皆為 true。

使用！ 對於否定

let isLoggedIn = false;

if (!isLoggedIn) {
  console.log("Please log in.");
} else {
  console.log("Welcome back!");
}

說明：

• ! 運算子對 isLoggedIn 的值取反。如果 isLoggedIn 為 false，則 !isLoggedIn 為 true。

總結

• || (OR)：傳回第一個真值或最後一個值（如果全部為假值）。
• && (AND)：傳回第一個假值或最後一個值（如果所有值均為真值）。
• ！ (NOT)：傳回其運算元的相反布林值。

結論

邏輯運算子是 JavaScript 中強大的工具，可讓您建立複雜的條件並控製程式的流程。透過掌握 ||、&& 和 !，您將能夠編寫更動態、更有效率的程式碼。不斷練習與探索，加深對 JavaScript 中邏輯運算子的理解。

請繼續關注更多關於 JavaScript 的深入部落格！快樂編碼！

以上是掌握 JavaScript 中的邏輯運算子：`||`、`&&` 和 `!`的詳細內容。更多資訊請關注PHP中文網其他相關文章！