Operador de JavaScript ternário condicional

1. Exemplo: JavaScript Ternary Conditional Operator
2. Exemplo: Operadores ternários aninhados em JavaScript
3. Exemplo: Operações múltiplas no operador ternário JavaScript

Este tutorial irá apresentar como usar o operador condicional ?: Em JavaScript.

A instrução if ... else nos ajuda a executar um determinado bloco de código apenas se uma determinada condição for atendida. O operador condicional, também conhecido como operador ternário, é uma abreviação de uma linha para instruções if ... else. Ajuda a escrever um código limpo e conciso. É o único operador JavaScript que requer 3 operandos: a condição a ser avaliada, uma expressão a ser executada se a condição for true e uma expressão a ser executada se a condição for false. Como leva 3 operandos, seu nome é o operador ternário.

condition ? expression1 : expression2

O operador ternário primeiro avalia a condition dada. A condição é separada da expression1 por um ? e expression2 é separada de expression1 por um :. Se a condition for verdadeira, o operador condicional executa a expression1, caso contrário, executa a expression2.

Exemplo: JavaScript Ternary Conditional Operator

var age = 18;
var canVote;
if (age >= 18) {
  canVote = 'yes';
} else {
  canVote = 'no';
}

O exemplo acima mostra uma instrução condicional executada usando a instrução tradicional if ... else.

var age = 18;
var canVote = age >= 18 ? 'yes' : 'no';

Reescrevemos o trecho de código acima usando o operador ternário.

Exemplo: Operadores ternários aninhados em JavaScript

Como a instrução if ... else, também podemos usar operadores ternários aninhados para realizar a verificação de múltiplas condições.

var carSpeed = 90;
var warning =
    speed >= 100 ? 'Way Too Fast!!' : (speed >= 80 ? 'Fast!!' : 'Nice :)');
console.log(warning);

No código acima, geramos um aviso para o carro com base na velocidade do carro. Primeiro, verificamos se carSpeed é superior a 100 e se a condição for satisfeita, geramos um aviso dizendo que o carro está se movendo Way Too Fast!!. Caso contrário, aninhamos uma segunda expressão verificando se carSpeed é maior que 80 e exibindo Fast / Nice dependendo da avaliação.

Exemplo: Operações múltiplas no operador ternário JavaScript

Podemos executar várias operações dentro de um operador ternário, como as instruções if ... else.

let isStudent = true;
let primeVideo = 12;
isStudent ?
    (primeVideo = primeVideo / 2, alert('Enjoy your student discount')) :
    (alert('You have to pay full price'));

No código acima, realizamos duas operações em vez de uma, alterando o valor de primeVideo para sua metade e alertando o usuário.