Умовний (тернарний) оператор

Умовний (тернарний) оператор - це єдиний оператор JavaScript, який приймає три операнди: умову, за якою йде знак питання (?), далі вираз, який має виконатися, якщо умова правдива, далі двокрапка (:) і, нарешті, вираз, який має виконатись, якщо умова хибна. Цей оператор часто використовують в якості скорочення конструкції if.

Синтаксис

condition ? exprIfTrue : exprIfFalse 

Параметри

condition
Вираз, який використовується в якості умови.
exprIfTrue
Вираз, який виконується, якщо вираз condition оцінений як правдивий (який дорівнює або може бути приведений до true).
exprIfFalse
Вираз, який виконується, якщо вираз condition є хибним (тобто, його значення може бути приведене до false).

Опис

Окрім false, можливими хибними значеннями є: null, NaN, 0, порожній рядок ("") та undefined. Якщо condition дорівнює будь-якому з них, результатом умовного виразу буде результат виконання виразу exprIfFalse.

Простий приклад:

var age = 26;
var beverage = (age >= 21) ? "Пиво" : "Сік";
console.log(beverage); // "Пиво"

Одним з типових використань є обробка значення, яке може дорівнювати null:

function greeting(person) {
    var name = person ? person.name : "незнайомець";
    return "Привіт, " + name;
}

console.log(greeting({name: 'Аліса'}));  // "Привіт, Аліса"
console.log(greeting(null));             // "Привіт, незнайомець"​​​​​

Заувага: Оператор необов'язкового ланцюгування був створений для використання у таких випадках. На момент написання (липень 2019), він досі є експериментальним і не був реалізований.

Умовні ланцюги

Тернарний оператор є правоасоціативним, це означає, що він може створювати ланцюги наступним чином, схоже на ланцюг if … else if … else if … else:

function example() {
    return condition1 ? value1
         : condition2 ? value2
         : condition3 ? value3
         : value4;
}

// Є еквівалентом:

function example() {
    if (condition1) { return value1; }
    else if (condition2) { return value2; }
    else if (condition3) { return value3; }
    else { return value4; }
}

Специфікації

Специфікація
ECMAScript (ECMA-262)
The definition of 'Conditional Operator' in that specification.

Сумісність з веб-переглядачами

BCD tables only load in the browser

Див. також