Truque simples para deixar sua aplicação JS mais robusta · dami

"Não confie no JavaScript."
–Todo programador que se preze.

Que o JavaScript é cheio de problemas, todos sabemos. Mas acredito que um dos maiores problemas são os valores e expressões truthy e falsy (ou boolean-ish).

O JavaScript tenta "booleanizar" as expressões dentro de um if (ou while). E essa é a causa de muitos bugs.

Por exemplo: if (0) é avaliado como if (false). Mas e se um valor numérico zero for válido para sua aplicação?

E if ([]) é avaliado como if (true). Mas e se um array vazio não for válido?

Valor/expressão	Valor boolean-ish
`NaN`	`false`
`null`	`false`
`undefined`	`false`
`0`	`false`
`""` (string vazia)	`false`
`[]` (array vazio)	`true`
`{}` (objeto vazio)	`true`
`"true"` (string)	`true`
`"false"` (string)	`true`

A solução

Para evitar esses problemas, garanta que as expressões avaliadas dentro de um if sejam verdadeiramente booleanas. Convertam valores em expressões ou funções que retornam um valor booleano.

Se `x` puder assumir o valor:	Em vez de `if (x)`, use:
`NaN`	`if (Number.isNaN(x))`
`null`	`if (x === null)` ou `if (null === x)`
`undefined`	`if (x === undefined)` ou `if (undefined === x)`
`0`	`if (x === 0)` ou `if (0 === x)`
`""` (string vazia)	`if (x === "")` ou `if ("" === x)` ou `if (x.length === 0)`
`[]` (array vazio)	`if (x.length === 0)` ou `if (0 === x.length)`
`{}` (objeto vazio)	`if (Object.keys(x).length === 0)` ou `if (0 === Object.keys(x).length)`
`"true"`	`if (x === "true")` ou `if ("true" === x)`
`"false"`	`if (x === "false")` ou `if ("false" === x)`

Mais exemplos

Se você quiser tratar strings "true" como true e "false" como false:

function getBooleanValueOf(str) {
    return str.toLowerCase() === "true"; // Tudo o que não for "true" será tratado como false (inclusive "false")
}

if (getBooleanValueOf(x)) {
    // ...
}

Se você espera um valor numérico qualquer, sendo zero um valor válido, mas ele pode ser undefined, use if (x !== undefined).

Quem mais pode contribuir?