Operator Nullish Coalescing

Operator nullish coalescing (??) w JavaScript to nowoczesna funkcjonalność, która pozwala na bardziej precyzyjne obsługiwanie wartości, które są null lub undefined. W przeciwieństwie do operatora logicznego OR (||), który zwraca prawą stronę wyrażenia, gdy lewa strona jest falsy (co obejmuje wartości takie jak 0, '' (pusty ciąg) i false), operator nullish coalescing zwraca prawą stronę wyrażenia tylko wtedy, gdy lewa strona jest dokładnie null lub undefined. To czyni go szczególnie użytecznym w sytuacjach, gdzie wartości takie jak 0 lub false są prawidłowymi i oczekiwanymi wartościami.

Przykład zastosowania operatora nullish

W poniższym kompletnym pliku HTML z JavaScript przedstawiam przykłady użycia operatora nullish coalescing, ilustrując różnicę w zachowaniu w stosunku do operatora OR.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Operator Nullish Coalescing w JavaScript</title>
</head>
<body>
    <h3>Przykłady użycia operatora Nullish Coalescing (??)</h3>
    <script>
        // Przykład 1: Użycie z wartością undefined
        const value1 = undefined;
        // Jeśli value1 jest null lub undefined, użyj 'wartość domyślna'
        const result1 = value1 ?? 'wartość domyślna';
        console.log(result1); // Wypisze: 'wartość domyślna'

        // Przykład 2: Użycie z wartością null
        const value2 = null;
        // Podobnie jak w przykładzie 1, zwróci 'wartość domyślna'
        const result2 = value2 ?? 'wartość domyślna';
        console.log(result2); // Wypisze: 'wartość domyślna'

        // Przykład 3: Użycie z wartością 0 (zero jest wartością "falsy" w JS, ale nie jest null/undefined)
        const value3 = 0;
        // W przeciwieństwie do operatora ||, ?? pozwala na zachowanie 0 jako wartości
        const result3 = value3 ?? 'wartość domyślna';
        console.log(result3); // Wypisze: 0

        // Przykład 4: Użycie z pustym ciągiem (również "falsy", ale nie null/undefined)
        const value4 = '';
        // Ponownie, dzięki ??, pusty ciąg jest traktowany jako wartość, a nie zastępowany
        const result4 = value4 ?? 'wartość domyślna';
        console.log(result4); // Wypisze: ''

        // Uwaga: Użycie operatora || w powyższych przykładach zamiast ?? dałoby
        // 'wartość domyślna' dla result3 i result4, co może być niepożądane.
    </script>
</body>
</html>

W tym kodzie, operator nullish coalescing (??) jest używany do określenia wartości domyślnych dla różnych scenariuszy, w których wartości mogą być undefined lub null. Demonstruje to, jak operator ten pozwala na bardziej precyzyjne i intuicyjne zarządzanie domyślnymi wartościami w JavaScript.

Podsumowanie

Operator nullish coalescing (??) w JavaScript jest przydatnym narzędziem, które zapewnia większą kontrolę nad wartościami, które mogą być null lub undefined. Dzięki niemu, deweloperzy mogą unikać niepożądanych efektów ubocznych w swoich programach.

Jeżeli chcesz przyśpieszyć swoją naukę tworzenia stron chciałbym polecić mój kurs JavaScript od podstaw w którym nauczysz się tego języka od podstaw do zaawansowanych jego aspektów.

Scroll to Top