10 января 2023 г.
Тернарный оператор в JavaScript может принимать три операнда:
- условие, за которым следует знак вопроса (?), принимающее значение true или false;
- первое выражение, выполняющиеся, если условие истинно, за ним следует двоеточие «:»;
- выражение, выполняющиеся, если условие ложно.
Оператор используется в качестве укороченного варианта условного оператора if.
Например, выводим сообщение в myDiv:
let Age = 18;
document.getElementById("myDiv").innerHTML = 'Ваш возраст' + (Age > 18 ? "больше восемнадцати" : "восемнадцать и меньше") + "лет";
// выводит "Ваш возраст больше восемнадцати"
Или, выводим значение в переменную:
let Age = 17;
let Access = Age >= 18 ? true : false;
console.log( Access ); // выводит в консоль false
Также можно сделать множественные тернарные операции (при этом условный оператор ассоциативен справа):
let Age = 21, Privilege = true;
let Access = Age >= 18 ? "Доступ запрещён" : Privilege ? "Доступ разрешён" : "Доступ запрещён";
console.log( Access ); // выводит в консоль "Доступ разрешён"
Тернарные операции можно использовать и сами по себе - для выполнения различных операций:
let Denied = false, Age = 25;
Age > 18 ? location.assign("some_good_page.html") : Denied = true;
// пересылает на страницу some_good_page.html
Или, тот же пример с другими значениями:
let Denied = false, Age = 17;
Age > 18 ? location.assign("some_good_page.html") : Denied = true;
// устанавливает переменной Denied значение true
Также возможно выполнять несколько операций на каждое сравнение, разделив их запятыми:
let Denied = false, Age = 23;
Age > 18 ? (
alert("Доступ к ресурсу разрешён"),
location.assign("some_good_page.html")
) : (
Denied = true,
alert("Доступ к ресурсу запрещён.")
);
// выводит сообщение "Доступ к ресурсу разрешён"
// и затем пересылает на страницу some_good_page.html
При присвоении значения переменной возможно выполнение нескольких операций. Переменной присваивается значение, которое стоит последним в списке значений, разделённых запятой.
let Age = 16;
let myURL = Age > 18 ? (
some_function_1(),
// возвращаемое значение some_function_1 будет проигнорировано, потому что
// не является последним в списке значений, разделённых запятой
"some_good_page.html"
// значение переменной будет присвоено, если Age > 18
) : (
some_function_2(),
// возвращаемое значение some_function_2 также будет проигнорировано
"access_denied.html"
// значение будет присвоено, если Age > 18
);
location.assign(myURL); // пересылает на страницу access_denied.html