DEV Community

Cover image for Operador de Nullish Coalescing (??) em Javascript
Matheus dos Reis de Jesus
Matheus dos Reis de Jesus

Posted on • Updated on

Operador de Nullish Coalescing (??) em Javascript

Capa por Evan Dennis no Unsplash

Sumário

Introdução

Talvez em algum momento você tenha se deparado com um trecho de código em Javascript da seguinte maneira:

const valor = valorReal || "valorPadrão";
Enter fullscreen mode Exit fullscreen mode

O operador || usado acima é chamado de OU lógico, e funciona da seguinte maneira: Se o valor à esquerda do operador for verdadeiro, seu valor será atribuído à variável valor. Se o seu valor for falso, a variável valor receberá o valor à direta, "valorPadrão".

Se você já está habituado com Javascript, deve saber que existem vários problemas com relação a falsidade ou veracidade de valores na linguagem. Exemplo: "" e 0 são considerados valores falsos. Logo, se em um algoritmo "" ou 0 forem valores válidos, o operador || não iria fornecer o resultado necessário. É aí que entra o operador de Coalescência Nula(ou Nullish Coalescing).

O operador ??

Agora que você já entendeu o problema, vêm a solução. O operador de Coalescência Nula é representado por ?? e utilizado da seguinte forma:

const valor = valorReal ?? "valorPadrão";
Enter fullscreen mode Exit fullscreen mode

Nesse caso, se o valor da variável valorReal for null ou undefined, a variável valor receberá "valorPadrão". Caso contrário, ela receberá o valor de valorReal.

Caso de Uso

Pense no seguinte cenário: Você está fazendo um cálculo que utiliza um coeficiente. Se o coeficiente não for fornecido, ele irá receber um valor padrão, sendo 0 um valor válido. Como comentei, o operador || iria impedir que o 0 fosse utilizado. Nesse caso, o operador ?? se torna muito útil. Confira a representação desse problema abaixo:

function calcularResultado(x,y,coeficiente) { ;
    const c = coeficiente ?? 0.5;
    return x + y * c;
}

const resultado = calculaResultado(2,3);
console.log(resultado) // Saída: 3.5 ( 2 + 3 * 0,5 )
Enter fullscreen mode Exit fullscreen mode

A função calculaResultado usa o ?? para verificar se o parâmetro coeficiente foi passado para a função. Caso tenha sido, seu valor será usado. Se não, o coeficiente padrão será 0.5.

Considerações

O caso que citei for um exemplo simples, mas o operador ?? pode ser útil em muitas situações e garantir uma maior confiabilidade no seu código.

Gostou deste artigo? Me siga para mais conteúdos como esse!

Minhas redes sociais:

Twitter | Instagram | Youtube.

Até o próximo artigo!👋🏽

Top comments (12)

Collapse
 
eduardoklosowski profile image
Eduardo Klosowski

Eu sempre acho muito importante entender o que é considerado verdadeiro e falso nas linguagens, isso pode inclusive resultar em códigos mais simples. Um exemplo de Python que sempre uso: imagine uma string nome e deseja-se validar se ela tem algum caractere:

if len(nome) != 0:
Enter fullscreen mode Exit fullscreen mode

Porém o valor 0 é interpretado como falso, e qualquer coisa diferente disso é interpretado como verdadeiro, então:

if len(nome):
Enter fullscreen mode Exit fullscreen mode

Porém, de forma semelhante ao 0, strings vazias são interpretadas como falso, e se tiverem algum caractere é interpretada como verdadeiro, então:

if nome:
Enter fullscreen mode Exit fullscreen mode

Muito mais simples e direto.

Collapse
 
reisdev profile image
Matheus dos Reis de Jesus • Edited

Eu acho curioso que essas simplificações, ora são um problema, ora são uma solução! Conhecer bem as ferramentas é essencial pra escrever um código simples e confiável! Obrigado por acrescentar ao post!

Collapse
 
eduardoklosowski profile image
Eduardo Klosowski

Sim, e elas se tornam um problema principalmente quando se desconhece o comportamento da linguagem.

Thread Thread
 
reisdev profile image
Matheus dos Reis de Jesus

Exato! E vejo isso acontecer principalmente com Javascript.. quem tá começando sofre

Thread Thread
 
eduardoklosowski profile image
Eduardo Klosowski

Uma coisa que sinto falta no JS é uma documentação, como a do Python. Sei que existe a documentação do node e a da Mozilla, porém quando eu tenho alguma dúvida de Python eu posso ir lá e consultar de forma fácil a documentação da estrutura de controle, e até analise lexical, exemplo. Enquanto no JS tem documentação das funções, ou textos que parecem mais posts de artigos explicando algo, e não como uma documentação propriamente dita (consisa e normativa).

Thread Thread
 
urielsouza29 profile image
Uriel dos Santos Souza

Concordo

Thread Thread
 
reisdev profile image
Matheus dos Reis de Jesus • Edited

Também Concordo! Talvez essa seja uma das maiores causas dos muitos problemas que enfrentamos com a linguagem

Collapse
 
urielsouza29 profile image
Uriel dos Santos Souza • Edited

A maior parte dos problemas de quem quer aprender JS é trazer a linguagem antiga para JS. Ou seja a pessoa não quer aprender uma nova linguagem, ela quer continuar com a antiga, mas no JS.

Por isso gera tanta confusão com JS. E gente reclamando.
Inserir "class" é uma das coisas que fizeram para agradar programador(preguiçoso?) de outras linguagens :)

Você acha que este operado ?? será muito usado?

Collapse
 
reisdev profile image
Matheus dos Reis de Jesus

Acho que vai um pouco além disso! Javascript tem muitos problemas de design, e isso acaba dificultando bastante o processo de aprendizado.
Atualmente ele já é suportado pela maioria dos navegadores! Vejo muito potencial. É extremamente útil e dá uma confiabilidade maior pro código. Ninguém merece código quebrado por causa de null/undefined.. :/

Collapse
 
urielsouza29 profile image
Uriel dos Santos Souza • Edited

O autor do texto simplesmente comprovou o que eu disse...
Vem viciado de outras linguagens... E quer continuar com elas
Embora não de pra negar que JS tem seus problemas

Igual C++ Ou Java...
Ninguém é perfeito kkkkk

Pra uma linguagem feita em 1 semana, começando de um jeito e sendo forçada pelo marketing a ser de outro jeito, durante esses 7 dias.

Até é bem boa kkkk

No mais o artigo é de 2016. As coisas mudaram

Collapse
 
adielseffrin profile image
Adiel Seffrin

Nossa, que massa isso, mas eu ainda achava que os operadores lógicos retornavam um valor lógico.. esse js sempre me surpreende 😅

Collapse
 
reisdev profile image
Matheus dos Reis de Jesus

Eu vivo me surpreendo com as coisas boas e ruins que JS tem!