條件運算子
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
條件 (三元) 運算子 是 JavaScript 唯一用到三個運算元的運算子:在一個條件後面會跟著一個問號 (?
),如果條件是 truthy,在冒號(:
)前的表達式會被執行,如果條件是 falsy,在冒號後面的表達式會被執行,這個運算子常常被用來當作 if
的簡潔寫法.
嘗試一下
語法
condition ? exprIfTrue : exprIfFalse
參數
condition
-
值用來做為條件的表達式
exprIfTrue
-
如果
condition
的值是 truthy (等於或是可轉換為true
) ,exprIfTrue
會被執行 exprIfFalse
-
如果
condition
的值是 falsy (等於或是可轉換為false
) ,exprIfFalse
會被執行
描述
除了 false
, 可能是 falsy 的表達式有 null
, NaN
, 0
, 空字串 (""
) 和 undefined
. 如果condition
是他們其中之一 , 那麼條件表達式的結果會是 exprIfFalse
的執行結果.
一個簡單的範例:
js
var age = 26;
var beverage = age >= 21 ? "Beer" : "Juice";
console.log(beverage); // "Beer"
一個常用來處理 null
的用法 :
js
function greeting(person) {
var name = person ? person.name : "stranger";
return "Howdy, " + name;
}
console.log(greeting({ name: "Alice" })); // "Howdy, Alice"
console.log(greeting(null)); // "Howdy, stranger"
條件鏈
條件 (三元) 運算子是右相依性的 (right-associative), 代表他可以以下面的方式鏈結 , 類似於 if … else if … else if … else
的鏈結方法 :
js
function example(…) {
return condition1 ? value1
: condition2 ? value2
: condition3 ? value3
: value4;
}
// Equivalent to:
function example(…) {
if (condition1) { return value1; }
else if (condition2) { return value2; }
else if (condition3) { return value3; }
else { return value4; }
}
規範
Specification |
---|
ECMAScript Language Specification # sec-conditional-operator |
瀏覽器相容性
BCD tables only load in the browser