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.