При каких условиях возвращается правая часть при использовании ??

Оператор нулевого слияния (??) в JavaScript

Оператор нулевого слияния (??) возвращает правую часть выражения только в двух конкретных случаях, когда левая часть является null или undefined. Это ключевое отличие от логического оператора ИЛИ (||), который возвращает правую часть для любых ложных (falsy) значений.

Условия возврата правой части:

// Примеры, где возвращается ПРАВАЯ часть
let result;

// Условие 1: Левая часть равна null
result = null ?? 'правая часть'; // 'правая часть'

// Условие 2: Левая часть равна undefined
result = undefined ?? 'правая часть'; // 'правая часть'

// Во всех остальных случаях возвращается ЛЕВАЯ часть
result = 0 ?? 'правая часть'; // 0 (не null/undefined)
result = false ?? 'правая часть'; // false (не null/undefined)
result = '' ?? 'правая часть'; // '' (не null/undefined)
result = NaN ?? 'правая часть'; // NaN (не null/undefined)

Контраст с оператором || (логическое ИЛИ)

Важно понимать разницу между ?? и ||, так как они ведут себя по-разному с falsy-значениями:

// Сравнение поведения
const defaultValue = 'значение по умолчанию';

console.log(null || defaultValue); // 'значение по умолчанию'
console.log(undefined || defaultValue); // 'значение по умолчанию'
console.log(0 || defaultValue); // 'значение по умолчанию' (0 - falsy)
console.log('' || defaultValue); // 'значение по умолчанию' ('' - falsy)
console.log(false || defaultValue); // 'значение по умолчанию' (false - falsy)

console.log(null ?? defaultValue); // 'значение по умолчанию'
console.log(undefined ?? defaultValue); // 'значение по умолчанию'
console.log(0 ?? defaultValue); // 0 (не заменяется!)
console.log('' ?? defaultValue); // '' (не заменяется!)
console.log(false ?? defaultValue); // false (не заменяется!)

Практические примеры использования

Работа с настройками по умолчанию - идеальный случай для ??, когда нужно различать "не установлено" и "явно установленное falsy-значение":

// Конфигурация приложения
function createUserConfig(config) {
    return {
        theme: config.theme ?? 'light', // если не указана - 'light'
        itemsPerPage: config.itemsPerPage ?? 10, // если 0 допустимо - используем ??
        notificationsEnabled: config.notificationsEnabled ?? true,
        // При использовании || могла бы потеряться возможность отключить уведомления
    };
}

const userSettings = {
    theme: 'dark',
    itemsPerPage: 0, // Явно установлен 0 (пользователь хочет 0 элементов на странице)
    notificationsEnabled: false // Явно отключены
};

console.log(createUserConfig(userSettings));
// {
//   theme: 'dark',
//   itemsPerPage: 0, // Сохранилось! С || было бы 10
//   notificationsEnabled: false // Сохранилось! С || было бы true
// }

Обработка данных API, где null/undefined означают отсутствие данных, а не осмысленные значения:

// Получение данных с сервера
const apiResponse = {
    name: 'Иван',
    age: null, // Возраст неизвестен
    email: undefined, // Email не указан
    postsCount: 0 // Написал 0 постов (это осмысленное значение!)
};

const processedData = {
    name: apiResponse.name ?? 'Неизвестно',
    age: apiResponse.age ?? 'Возраст не указан',
    email: apiResponse.email ?? 'Email отсутствует',
    postsCount: apiResponse.postsCount ?? 'Нет данных о постах'
};

console.log(processedData.postsCount); // 0 (а не 'Нет данных о постах')

Особенности приоритета и группировки

Оператор ?? имеет более низкий приоритет, чем || и &&, поэтому часто требуется использовать скобки:

// Без скобок может возникнуть ошибка синтаксиса
// let x = a && b ?? c; // SyntaxError

// Правильно с использованием скобок
let x = (a && b) ?? c;

Когда использовать оператор ??

Оператор нулевого слияния идеально подходит для:

• Установки значений по умолчанию, когда нужно различать null/undefined и другие falsy-значения
• Обработки данных, где 0, false, '' являются валидными значениями
• Работы с опциональными полями объектов и параметрами функций

Этот оператор был добавлен в ES2020 именно для решения проблемы, когда разработчикам нужно было различать "значение отсутствует" (null/undefined) и "значение равно falsy". Он делает код более предсказуемым и устраняет распространённые ошибки, связанные с неявным приведением типов.