📌 基本介紹

在 JavaScript 中，條件 (三元) 運算子 (Conditional / Ternary Operator) 是 if...else 的簡寫方式，可以讓程式碼更簡潔。

📖 語法

條件 ? 條件為真時的表達式 : 條件為假時的表達式;

範例 1：基本用法

let age = 18;
let result = (age >= 18) ? "成年人" : "未成年";
console.log(result); // 成年人

等同於：

if (age >= 18) {
  result = "成年人";
} else {
  result = "未成年";
}

範例 2：巢狀 (多層) 三元運算子

let score = 85;
let grade = (score >= 90) ? "A" :
            (score >= 75) ? "B" :
            (score >= 60) ? "C" : "F";

console.log(grade); // B

判斷流程：

• 當 score >= 90 → A

• 否則檢查 score >= 75 → B

• 否則檢查 score >= 60 → C

• 否則 → F

範例 3：搭配函式使用

function isEven(num) {
  return (num % 2 === 0) ? "偶數" : "奇數";
}

console.log(isEven(10)); // 偶數
console.log(isEven(7));  // 奇數

三元運算子常用來直接 回傳結果，比 if...else 更簡潔。

範例 4：搭配變數與運算

let a = 5;
let b = 10;
let max = (a > b) ? a : b;
console.log("較大值為: " + max); // 較大值為: 10

常見於「比較大小」或「條件選擇變數值」。

範例 5：三元運算子 vs if...else

使用三元運算子

let isMember = true;
let fee = isMember ? 100 : 300;
console.log(fee); // 100

使用 if...else

let isMember = true;
let fee;
if (isMember) {
  fee = 100;
} else {
  fee = 300;
}
console.log(fee); // 100

可以看到三元運算子更精簡，但在判斷邏輯 複雜 時，if...else 會更清楚。

使用建議

適合：

• 條件判斷簡單

• 在一行內給變數賦值

• 函式直接回傳結果

不適合：

• 條件過多、巢狀過深 → 會降低程式碼可讀性

• 多行邏輯判斷 → 建議使用 if...else