Fala, pessoal. Tudo bem? Hoje nós vamos falar sobre o operador de coalescência nula.

Primeiramente, para entendermos o operador de coalescência nula (??), precisamos de uma breve introdução.

Talvez, em algum momento do seu estudo ou trabalho, você tenha se deparado com um código parecido com este:

let qualquerValor;
let valor = qualquerValor || "Valor Padrão";
console.log(valor); // Valor Padrão

O operador || é chamado de OU lógico, e ele funciona da seguinte maneira: se a variável qualquerValor tiver um valor associado, a variável valor receberá esse valor que estava na variável qualquerValor. No entanto, se ela não tiver nenhum valor, a variável valor receberá o valor da direita ou seja, receberá o valor que está depois do operador ||, que servirá como um valor padrão.

Qual o problema disso?

Se você está familiarizado com JavaScript, você já deve saber que existem vários “problemas” quanto a questão de falsidade e veracidade de valores, por exemplo:

Valores que são considerados falsos

  • string vazia: “”
  • número 0 (zero)
  • false
  • null
  • undefined
  • NaN

Valores que são considerados verdadeiros

  • tudo que não for falso.
  • strings que não estejam vazias: ” “, “0”, “true”, “false” etc…
  • todos os números que forem diferentes de 0 (zero): 1, 2, -1, -200, 1/100 etc…
  • true

Ou seja, se nós atribuirmos um valor 0 (zero) para a variável qualquerValor, e fôssemos seguir a lógica, era para o valor 0 (zero) ser atribuído a variável valor correto? No entanto, não é bem o que acontece, veja: 

let qualquerValor = 0;
let valor = qualquerValor || "Valor Padrão";
console.log(valor); // Valor Padrão

O valor padrão ainda está sendo associado a variável valor apesar de ter uma valor associado a variável qualquerValor (zero) o mesmo foi considerado como false, e é exatamente ai que entra o operador de coalescência nula.

O operador de coalescência nula (??)

Agora que você já entendeu o problema, vamos entender a solução:

let qualquerValor = 0;
let valor = qualquerValor ?? "Valor Padrão";
console.log(valor); // 0

Assim sendo, nesse caso, ao usar o operador ?? ao invés de ||, se o valor da variável  for null ou undefined, a variável valor receberá Valor Padrão. Caso contrário, ela receberá o valor da variável qualquerValor.

Conclusão

Os exemplos acima são bem simples, mas o operador de coalescência nula pode ser muito útil em diversas outros casos, por exemplo, você fez um consulta no banco e não quer que essa variável que vai receber o resultado da consulta seja null ou undefined. Portanto, neste caso, o operador ?? vai ser uma ótima escolha de uso.

Eu fico por aqui, um abraço e até a próxima!

Leia também:

NVM – Instalação e utilização

Entendendo o this – JavaScript

Referência – MDN