Оператор нулевого слияния

Оператор нулевого слияния (??) это логический оператор, который возвращает значение правого операнда когда значение левого операнда равно null или undefined, в противном случае будет возвращено значение левого операнда.

В отличие от логического ИЛИ (||), левая часть оператора вычисляется и возвращается даже если его результат после приведения к логическому типу оказывается ложным, но не является null или undefined. Другими словами, если вы используете || чтобы установить значение по умолчанию, вы можете столкнуться с неожиданным поведением если считаете некоторые ложные значения пригодными для использования (например, "" или 0). Ниже приведены примеры.

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
See PR #1482 regarding the addition of this example.

leftExpr ?? rightExpr

В этом примере показано как устанавливать значения по умолчанию, оставив в покое значения отличные от null или undefined.

const nullValue = null;
const emptyText = ""; // falsy
const someNumber = 42;

const valA = nullValue ?? "default for A";
const valB = emptyText ?? "default for B";
const valC = someNumber ?? 0;

console.log(valA); // "default for A"
console.log(valB); // "" (так как пустая строка не null или undefined)
console.log(valC); // 42

Ранее, для присваивания значения по умолчанию переменной использовался оператор логического ИЛИ (||):

let foo;

//  переменной foo никогда не присваивалось значение, поэтому она undefined
let someDummyText = foo || 'Hello!';

Однако, оператор || это логический оператор, левый операнд которого при сравнении неявно приводится к булевому значению, поэтому любое ложное значение (0, '', NaN, null, undefined) не возвращается. Данное поведение может быть нежелательным если вы рассматриваете 0, '', или NaN как корректные значения.

let count = 0;
let text = "";

let qty = count || 42;
let message = text || "hi!";
console.log(qty);     // 42 and not 0
console.log(message); // "hi!" and not ""

Оператор нулевого слияния предотвращает попадание в такую ловушку, возвращая второй операнд если первый оказывается null or undefined (но не любым другим ложным значением):

let myText = ''; // Пустая строка (тоже является ложным значением при приведении к логическому типу)

let notFalsyText = myText || 'Hello world';
console.log(notFalsyText); // Hello world

let preservingFalsy = myText ?? 'Hi neighborhood';
console.log(preservingFalsy); // '' (так как myText не undefined и не null)

Так же как при использовании логического И и ИЛИ, правое выражение не вычисляется если найдено подходящее значение в левом.

function A() { console.log('A was called'); return undefined;}
function B() { console.log('B was called'); return false;}
function C() { console.log('C was called'); return "foo";}

console.log( A() ?? C() );
// выводит "A was called", затем "C was called", и затем "foo"
// так как A() возвращает undefined, поэтому оба выражения вычисляются

console.log( B() ?? C() );
// выводит "B was called", затем "false"
// так как B() возвращает false (но не null или undefined), правое
// выражение не вычисляется

Нельзя напрямую объединять И (&&) и ИЛИ (||) операторы с ??. При таком выражении будет выброшен SyntaxError.

null || undefined ?? "foo"; // выбрасывает SyntaxError
true || undefined ?? "foo"; // выбрасывает SyntaxError

Однако, при заключении в скобки выражение является корректным:

(null || undefined) ?? "foo"; // returns "foo"

Оператор нулевого слияния определяет undefined и null как специальные значения так же как и оператор опциональной последовательности (?.), который используется для доступа к свойствам объекта, значение которого может быть null или undefined.

let foo = { someFooProp: "hi" };

console.log(foo.someFooProp?.toUpperCase());  // "HI"
console.log(foo.someBarProp?.toUpperCase()); // undefined

В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция еще не достигла стабильности в разных браузерах. Данные генерируются путем запуска соответствующих тестов функциональности в Test262, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.

• Оператор опциональной последовательности
• Логическое ИЛИ (||)
• Параметры по умолчанию