Wartości truthy i falsy w JavaScript: pełna lista

Każda wartość ma logiczny „nastrój”

JavaScript pozwala umieścić dowolną wartość tam, gdzie oczekiwany jest boolean: w if, jako warunek while, obok && albo ||. Wtedy wartość zostaje zamieniona na true albo false. Wartości zamieniane na false nazywamy falsy. Wszystkie pozostałe są truthy.

if ("cześć") console.log("stringi są truthy");
if (42) console.log("liczby różne od zera są truthy");
if ([]) console.log("puste tablice są truthy");
if ({}) console.log("puste obiekty są truthy");

if (!0) console.log("zero jest falsy");
if (!"") console.log("pusty string jest falsy");

Bez funkcji konwertującej, bez jawnego rzutowania: JavaScript robi to automatycznie. Zasady są stałe i jest ich niewiele, więc gdy znasz listę wartości falsy, cała reszta wynika z niej sama.

Pełna lista wartości falsy

Falsy jest dokładnie siedem wartości. Wszystko inne w języku jest truthy.

const falsyValues = [false, 0, -0, 0n, "", null, undefined, NaN];

for (const v of falsyValues) {
    console.log(v, "->", Boolean(v));
}

To wszystko. Lista:

• false: sam boolean.
• 0 i -0: oba zera.
• 0n: zero typu BigInt.
• "": pusty string (w pojedynczych, podwójnych cudzysłowach albo backtickach, bez różnicy).
• null: wartość „celowo nic”.
• undefined: wartość „nie ustawiono”.
• NaN: wynik niepoprawnego działania, na przykład 0 / 0.

Zapamiętaj te siedem. Potem, gdy nie masz pewności co do jakiejś wartości, zapytaj: „czy to jedna z tych siedmiu?”. Jeśli nie, jest truthy.

Niespodzianki: "0", [] i {}

Tu początkujący najczęściej się parzą. Wiele wartości wygląda na puste, a jest truthy:

console.log(Boolean("0"));       // true - to niepusty string
console.log(Boolean("false"));   // true - nadal niepusty string
console.log(Boolean(" "));       // true - spacja też się liczy
console.log(Boolean([]));        // true - pusta tablica to obiekt
console.log(Boolean({}));        // true - pusty obiekt to obiekt
console.log(Boolean(new Date()));// true

Stringi są falsy tylko wtedy, gdy mają zero znaków. "0" ma jeden znak, więc jest truthy. Tablice i obiekty są zawsze truthy, nawet puste, bo JavaScript traktuje je jako obiekty, a wszystkie obiekty są truthy bez względu na zawartość.

Jeśli przychodzisz z Pythona, to największa zmiana w myśleniu. W Pythonie [] i {} są falsy. W JavaScript nie są.

Jak poprawnie sprawdzić, czy coś jest „puste”

Ponieważ [] i {} są truthy, nie możesz użyć ich bezpośrednio w if, żeby sprawdzić pustość. Pisz jawnie:

const items = [];
const user = {};

// Źle - wykonuje się zawsze:
if (items) console.log("items ma zawartość");

// Dobrze:
if (items.length === 0) console.log("items jest puste");
if (Object.keys(user).length === 0) console.log("user nie ma pól");

Podobnie ze stringami, jeśli string z samych spacji ma być traktowany jako pusty:

const input = "   ";
if (input) console.log("truthy, ale nie bardzo przydatne");
if (input.trim() === "") console.log("naprawdę puste");

Truthy/falsy to wygodny skrót, a nie zastępstwo dla zastanowienia się, co „puste” znaczy dla twoich danych.

Zamiana na prawdziwy boolean

Czasem potrzebujesz prawdziwego true albo false, a nie tylko wartości, która jest truthy. Są na to dwa idiomy:

const name = "Rosa";

console.log(Boolean(name));  // true
console.log(!!name);         // true

const empty = "";
console.log(Boolean(empty)); // false
console.log(!!empty);        // false

Boolean(x) to jawna konwersja. !!x to to samo w skrócie: pierwszy ! zamienia wartość na boolean i ją odwraca, drugi ! odwraca ją z powrotem. Oba są popularne. !! jest krótsze, Boolean() czyta się wyraźniej.

!! często zobaczysz w instrukcjach return, gdy funkcja ma zwrócić czysty boolean:

function hasItems(arr) {
    return !!arr && arr.length > 0;
}

console.log(hasItems([1, 2]));   // true
console.log(hasItems([]));        // false
console.log(hasItems(null));      // false

Truthy/falsy z && i ||

Operatory logiczne nie zwracają true ani false, tylko jeden z operandów. Który, zależy od tego, czy wartość jest truthy:

console.log("a" && "b");       // "b"  - both truthy, returns the last
console.log(0 && "b");         // 0    - short-circuits on the falsy one
console.log("" || "fallback"); // "fallback" - first is falsy, returns the second
console.log("hi" || "fallback");// "hi" - first is truthy, returns it

Dlatego value || defaultValue to tak popularny wzorzec wartości domyślnych. Ma jednak pułapkę: traktuje wszystkie wartości falsy tak samo, w tym 0 i "", które często są poprawnymi danymi:

function greet(name) {
    const who = name || "nieznajomy";
    console.log("Cześć, " + who);
}

greet("Ada");   // Cześć, Ada
greet("");      // Cześć, nieznajomy - a może "" było celowe?
greet(0);       // Cześć, nieznajomy - a 0 może być poprawnym id

Jeśli wartość domyślna ma działać tylko dla null albo undefined, użyj zamiast tego operatora nullish coalescing ??. Opisujemy go w osobnym dokumencie.

Ściągawka

// Falsy - all seven:
Boolean(false);     // false
Boolean(0);         // false
Boolean(-0);        // false
Boolean(0n);        // false
Boolean("");        // false
Boolean(null);      // false
Boolean(undefined); // false
Boolean(NaN);       // false

// Truthy - everything else:
Boolean("0");       // true
Boolean("false");   // true
Boolean([]);        // true
Boolean({});        // true
Boolean(() => {});  // true
Boolean(Infinity);  // true
Boolean(-Infinity); // true

Wydrukuj ją, przyklej do monitora i żyj dalej.

Dalej: iteratory i generatory

Skoro instrukcje warunkowe i pętle masz już opanowane, następny rozdział pokazuje, jak JavaScript pozwala wartościom powstawać na żądanie. Iteratory i generatory to mechanizm stojący za for...of, spreadem i wieloma nowoczesnymi API. To właśnie one są następne.