Gibt es einen "Null-Koaleszenz"-Operator in JavaScript?

Question

Gibt es einen Null-Koaleszenz-Operator in Javascript?

In C# kann ich zum Beispiel Folgendes tun:

String someString = null;
var whatIWant = someString ?? "Cookies!";

Die beste Annäherung, die ich für Javascript herausfinden kann, ist die Verwendung des Bedingungsoperators:

var someString = null;
var whatIWant = someString ? someString : 'Cookies!';

Was IMHO ziemlich eklig ist. Kann ich es besser machen?

Answer 1

Beachten Sie, dass Reacts create-react-app Werkzeugkette unterstützt die Null-Koaleszenz seit Version 3.3.0 (veröffentlicht am 5.12.2019) . Aus den Versionshinweisen:

Optionale Verkettungs- und Nullish Coalescing-Operatoren

Wir unterstützen jetzt die optionalen Verkettungs- und Nullish-Coalescing-Operatoren!

// Optional chaining
a?.(); // undefined if `a` is null/undefined
b?.c; // undefined if `b` is null/undefined

// Nullish coalescing
undefined ?? 'some other default'; // result: 'some other default'
null ?? 'some other default'; // result: 'some other default'
'' ?? 'some other default'; // result: ''
0 ?? 300; // result: 0
false ?? true; // result: false

Das heißt, falls Sie die create-react-app 3.3.0+ können Sie den Null-Koaleszenz-Operator bereits heute in Ihren React-Anwendungen verwenden.

Answer 2

Es wird hoffentlich bald in Javascript verfügbar sein, da es sich ab April 2020 in der Angebotsphase befindet. Sie können den Status hier für Kompatibilität und Unterstützung überwachen - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator

Für Leute, die Typescript verwenden, können Sie die Nullkoaleszenzoperator de Typografie 3.7

Aus den Unterlagen -

Sie können sich dieses Merkmal - die ?? Operator - als eine Möglichkeit, "zu fallen auf einen Standardwert zurückgreifen, wenn es um null o undefined . Wenn wir Code schreiben wie

let x = foo ?? bar();

Dies ist eine neue Art zu sagen, dass der Wert foo wird verwendet, wenn es "anwesend" ist; wenn es aber null o undefined , berechnen bar() an seiner Stelle.

Answer 3

Sie müssen alte Browser unterstützen und eine Objekthierarchie haben

body.head.eyes[0]  //body, head, eyes  may be null 

können dies verwenden,

(((body||{}) .head||{}) .eyes||[])[0] ||'left eye'

Answer 4

ECMAScript 2021 zwei neue Funktionen aktiviert:

1. Nullischer Koaleszenzoperator (??) ist ein logischer Operator, der seinen rechten Operanden zurückgibt, wenn sein linker Operand entweder null oder undefiniert ist, und ansonsten seinen linken Operanden zurückgibt.

   let b = undefined ?? 5;

   console.log(b); // 5

2. Logische nullische Zuweisung (x ??= y) Operator, der nur zuweist, wenn x einen Nullwert hat (null oder undefiniert).

   const car = {speed : 20}; car.speed ??= 5; console.log(car.speed); car.name ??= "reno"; console.log(car.name);

Mehr über die logische Zuordnung von Nullen finden Sie hier https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_nullish_assignment

Mehr über den Nullish Coalescing Operator finden Sie hier https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator

Answer 5

Jetzt hat es volle Unterstützung in der neuesten Version von großen Browsern wie Chrome, Edge, Firefox, Safari etc. Hier ist der Vergleich zwischen dem Null-Operator und dem Nullish Coalescing Operator

const response = {
        settings: {
            nullValue: null,
            height: 400,
            animationDuration: 0,
            headerText: '',
            showSplashScreen: false
        }
    };
    /* OR Operator */
    const undefinedValue = response.settings.undefinedValue || 'Default Value'; // 'Default Value'
    const nullValue = response.settings.nullValue || 'Default Value'; // 'Default Value'
    const headerText = response.settings.headerText || 'Hello, world!'; //  'Hello, world!'
    const animationDuration = response.settings.animationDuration || 300; //  300
    const showSplashScreen = response.settings.showSplashScreen || true; //  true
    /* Nullish Coalescing Operator */
    const undefinedValue = response.settings.undefinedValue ?? 'Default Value'; // 'Default Value'
    const nullValue = response.settings.nullValue ?? ''Default Value'; // 'Default Value'
    const headerText = response.settings.headerText ?? 'Hello, world!'; // ''
    const animationDuration = response.settings.animationDuration ?? 300; // 0
    const showSplashScreen = response.settings.showSplashScreen ?? true; //  false