Verificação de null, undefined e valores vazios em JavaScript: guia completo

Por que verificar null, undefined e vazio é uma dor para todo desenvolvedor JavaScript?

Você já se pegou pensando: "Por que estou escrevendo novamente essa construção complicada com if (x !== null && x !== undefined && x !== '')?" Se sim, você não está sozinho. A pergunta "Is there a standard function to check for null, undefined, or blank variables in JavaScript?" no Stack Overflow acumulou milhares de visualizações. E não é por acaso.

JavaScript não possui uma função nativa que verifique tudo de uma só vez. Mas isso não significa que estamos condenados ao sofrimento. Neste artigo, vamos entender por que essa função não existe, como contornar essa limitação de forma elegante e criar nosso próprio helper ideal.

Pronto para transformar o caos das verificações em um código limpo e compreensível? Vamos lá!

O que são null, undefined e blank (string vazia) em JavaScript?

Antes de procurar a "pílula mágica", vamos entender com o que estamos lidando. Esses três conceitos são três animais diferentes, e confundi-los é perigoso.

\n
• undefined — a variável foi declarada, mas nenhum valor foi atribuído a ela. Este é o "valor padrão" do JavaScript.
\n
• null — a variável existe, mas "nada" foi intencionalmente atribuído a ela. Esta é uma escolha consciente do desenvolvedor.
\n
• blank (string vazia) — '' ou "". A string existe, mas não contém caracteres.
\n

A diferença chave: null é um objeto (sim, é um bug histórico do JS que agora é um recurso), undefined é um tipo especial, e uma string vazia é uma string.

let a; // undefined\nlet b = null; // null\nlet c = ''; // string vazia (blank)\nconsole.log(typeof a); // "undefined"\nconsole.log(typeof b); // "object" (sim, é assim!)\nconsole.log(typeof c); // "string"

Agora imagine: você quer verificar se uma variável está "vazia" em qualquer sentido. A verificação comum if (!value) funcionará para null e undefined, mas não considerará a string vazia? Não, considerará! Porque uma string vazia é um valor falsy. Mas há um porém...

Por que simplesmente usar if (!value) é uma má ideia?

Sim, if (!value) capturará null, undefined, '', 0, false e NaN. Mas e se 0 ou false forem valores válidos para sua variável? Por exemplo, se você está verificando a quantidade de itens no carrinho, 0 é normal, não é "vazio".

function processOrder(itemCount) {\n    if (!itemCount) {\n        console.log('Erro: nenhum item!');\n    } else {\n        console.log('Processando pedido...');\n    }\n}\nprocessOrder(0); // Erro: nenhum item! — Mas isso não é um erro, são 0 itens

É por isso que precisamos de uma função especializada, e não de uma verificação universal de "veracidade".

Função padrão? Não, mas existem padrões comuns

Para a pergunta "Is there a standard function?" a resposta é não. Mas o JavaScript oferece ferramentas flexíveis para que você possa criar a sua. E isso é ainda melhor, porque sua função atenderá exatamente aos seus requisitos de negócio.

Opção 1: Verificação mais simples (estrita)

Se você precisa verificar apenas null e undefined — use comparação estrita (===). Esta é a forma mais segura.

function isNullOrUndefined(value) {\n    return value === null || value === undefined;\n}\n\nconsole.log(isNullOrUndefined(null)); // true\nconsole.log(isNullOrUndefined(undefined)); // true\nconsole.log(isNullOrUndefined('')); // false\nconsole.log(isNullOrUndefined(0)); // false

Prós: não confunde 0 e string vazia com "nada". Contras: não verifica vazio