Operadores Condicionais em JavaScript
Os operadores condicionais permitem verificar uma condição e, dependendo do resultado da verificação, executar certas ações. Aqui examinaremos o operador ?:
ou o chamado operador ternário e a operação ??
.
Operação Ternária
A operação ternária consiste em três operandos e é definida da seguinte forma:
[primeiro operando - condição] ? [segundo operando] : [terceiro operando]
Dependendo da condição no primeiro operando, a operação ternária retorna o segundo ou o terceiro operando. Se a condição no primeiro operando for true
, o segundo operando é retornado; se for false
, o terceiro é retornado. Por exemplo:
const x = 1;
const y = 2;
const result = x < y ? x : y;
console.log(result); // 1
Aqui, o primeiro operando representa a condição x < y
. Se o valor da constante x
for menor que o valor da constante y
, o segundo operando - x
, é retornado, ou seja, a constante result
será igual a x
.
Se o valor da constante a for maior ou igual ao valor da constante y
, o terceiro operando - y
, é retornado, assim, a constante result
será igual ao valor de y
.
Os operandos também podem ser expressões:
const x = 1;
const y = 2;
const result = x < y ? x + y : x - y;
console.log(result); // 3
Neste exemplo de código, o primeiro operando representa a mesma condição que no exemplo anterior, mas o segundo e terceiro operandos representam operações aritméticas. Se o valor da constante a for menor que o valor da constante y
, o segundo operando a + y
é retornado. Assim, a constante result será igual à soma de x
e y
.
Se o valor da constante a for maior ou igual ao valor da constante y
, o terceiro operando x - y
é retornado. Assim, a constante result será igual à diferença de x
e y
.
Operador ??
O operador ??
(nullish coalescing operator) permite verificar um valor para null
e undefined
. Ele recebe dois operandos:
[operando esquerdo] ?? [operando direito]
O operador retorna o valor do operando esquerdo, se ele NÃO for igual a null
ou undefined
. Caso contrário, retorna o valor do operando direito. Por exemplo:
const result = "hello" ?? "world";
console.log(result); // hello
console.log(0 ?? 5); // 0
console.log("" ?? "javascript"); // "" - string vazia
console.log(false ?? true); // false
console.log(null ?? "not null"); // not null
console.log(undefined ?? "defined"); // defined
console.log(null ?? null); // null
console.log(undefined ?? undefined); // undefined
Operador ??=
O operador ??
tem uma modificação na forma do operador ??=
, que também permite verificar um valor para null
e undefined
. Ele recebe dois operandos:
[operando esquerdo] ?? [operando direito]
Se o operando esquerdo for igual a null
ou undefined
, então o valor do operando direito é atribuído a ele. Caso contrário, o operando esquerdo mantém seu valor. Por exemplo:
const message = "Hello JavaScript";
let text = "Hello work!";
text ??= message;
console.log(text); // Hello work!
Aqui, a variável text não é igual a null
ou undefined
, portanto mantém seu valor. Exemplo contrário:
const message = "Hello JavaScript";
let text = null;
text ??= message;
console.log(text); // Hello JavaScript
Aqui, a variável text é igual a null
, portanto, por meio do operador ??=
, ela recebe o valor da variável message
.