Um guia essencial para JavaScript null

Resumo : neste tutorial, você aprenderá sobre JavaScript nulle como lidar com ele de forma eficaz.

O que é nulo em JavaScript

JavaScript nullé um tipo primitivo que contém um valor especial null.

JavaScript usa o nullvalor para representar a ausência intencional de qualquer valor de objeto .

Se você encontrar uma variável ou função que retorne null, significa que o objeto esperado não pôde ser criado.

O exemplo a seguir define a Circle classe cujo construtor aceita um argumento radius. A Circleclasse possui um método estático chamado create()que retorna um novo Circleobjeto com um raio especificado.

class Circle {
    constructor(radius) {
        this.radius = radius;
    }
    get area() {
        return Math.PI * Math.pow(this.radius, 2);
    }

    static create(radius) {
        return radius > 0 ? new Circle(radius) : null
;
    }
}Linguagem de código:  JavaScript  ( javascript )

Isso cria um novo Circleobjeto com o raio 10:

let c = Circle.create(10);
console.log(c.area); // 31.41592653589793Linguagem de código:  JavaScript  ( javascript )

No entanto, o exemplo a seguir retorna nullporque o radiusargumento não é passado para o create()método:

let c2 = Circle.create();
console.log(c2); // nullLinguagem de código:  JavaScript  ( javascript )

Verifique se um valor é nulo

Para verificar se um valor é null, você usa o operador de igualdade estrita ===como este:

value === nullLinguagem de código:  JavaScript  ( javascript )

Por exemplo:

const rect = null;
const square = {
    dimension: 10
};

console.log(rect === null); // true
console.log(square === null); // falseLinguagem de código:  JavaScript  ( javascript )

O rect === nullé avaliado como verdadeiro porque a rectvariável é atribuída a um nullvalor. Por outro lado, é square === nullavaliado como falseporque está atribuído a um objeto.

Para verificar se um valor não é null, você usa o operador de desigualdade estrita ( !==):

value !== nullLinguagem de código:  JavaScript  ( javascript )

Recursos nulos de JavaScript

JavaScript nulo possui os seguintes recursos.

1) nulo é falso

Além disso false, 0, uma string vazia ( ''), undefined, NaN, nullé um valor falso. Isso significa que o JavaScript irá forçar nullcondicionais false. Por exemplo:

const square = null;
if (square) {
    console.log('The square is not null');
} else {
    console.log('The square is null');
}Linguagem de código:  JavaScript  ( javascript )

Saída:

The square is nullLinguagem de código:  JavaScript  ( javascript )

Neste exemplo, a squarevariável é null, portanto, a ifinstrução que a avalia falsee executa a instrução na elsecláusula.

2) typeof null é objeto

O typeof valueretorna o tipo do valor. Por exemplo:

console.log(typeof 10); // 'number'Linguagem de código:  JavaScript  ( javascript )

Surpreendentemente, os typeof nullretornos 'object':

console.log(typeof null); // 'object'Linguagem de código:  JavaScript  ( javascript )

Em JavaScript, nullé um valor primitivo, não um objeto. Acontece que este é um bug histórico da primeira versão do JavaScript que pode nunca ser corrigido.

Um erro comum de JavaScript nulo

Em JavaScript, muitas vezes você chama uma função para obter um objeto. E então você acessa a propriedade desse objeto.

No entanto, se a função retornar nullem vez de um objeto, você obterá um arquivo TypeError. Por exemplo:

let classList = document.querySelector('#save').classList;Linguagem de código:  JavaScript  ( javascript )

Neste exemplo, selecionamos um elemento com id savee acessamos sua classListpropriedade.

Se a página não tiver nenhum elemento com o id save, o document.querySelector('#save')retorno é null. Portanto, acessar a classNamepropriedade do nullvalor resulta em um erro:

Uncaught TypeError: Cannot read property 'classList' of nullLinguagem de código:  JavaScript  ( javascript )

Para evitar isso, você pode usar o operador de encadeamento opcional ( ?.)

object ?. property

O operador de encadeamento opcional retorna undefinedem vez de gerar um erro quando você tenta acessar uma propriedade de um valor null(ou undefined).

O exemplo a seguir usa o operador de encadeamento opcional que retorna undefinedem vez de um erro:

let classList = document.querySelector('#save')?.classList;Linguagem de código:  JavaScript  ( javascript )

JavaScript nulo vs. indefinido

Ambos nulle undefinedsão valores primitivos.

The undefinedé o valor de uma variável ou propriedade de objeto não inicializada.

Por exemplo, quando você declara uma variável sem inicializar um valor, a variável é avaliada como undefined:

let counter;
console.log(counter); // undefinedLinguagem de código:  JavaScript  ( javascript )

O nullrepresenta uma ausência intencional de um objeto, enquanto o undefinedrepresenta uma ausência não intencional de um valor .

Em outras palavras, the nullrepresenta um objeto ausente enquanto the undefinedrepresenta uma variável não inicializada.

Os nulle undefinedsão iguais quando você usa o operador de igualdade flexível ( ==):

console.log(null == undefined); // trueLinguagem de código:  JavaScript  ( javascript )

O operador de igualdade estrita ===diferencia o nulle undefined. Por exemplo:

console.log(null === undefined); // falseLinguagem de código:  JavaScript  ( javascript )

Resumo

• Javascript nullé um tipo primitivo que possui um valor nulo.
• JavaScript usa o valor nulo para representar um objeto ausente.
• Use o operador de igualdade estrita ( ===) para verificar se um valor é null.
• O typeof nullreturn 'object', que é um bug histórico em JavaScript que pode nunca ser corrigido.
• Use o operador de encadeamento opcional ( ?.) para acessar a propriedade de um objeto que pode ser null.