Присваивание логического ИЛИ (||=)

Оператор логического ИЛИ работает следующим образом:

x || y;
// возвращает x, если x истинноподобен
// возвращает y, если x не истинноподобен

Оператор логического ИЛИ OR производит вычисление по сокращённой схеме: второй операнд будет вычисляться только в случае, если при вычислении первого операнда не удалось получить значение.

Оператор присваивания логического ИЛИ также поддерживает сокращённое вычисление, т.е. выполнит операцию присваивания только при вычислении правого выражения. Проще говоря, x ||= y эквивалентно следующему коду:

x || (x = y);

В отличие от следующего примера, где операция присваивания произойдёт в любом случае:

x = x || y;

Обратите внимание, что математические и побитовые операторы присваивания работают по-разному.

Если в элементе с идентификатором "lyrics" нет содержимого, то следующее выражение вставит в него надпись:

document.getElementById("lyrics").textContent ||= "Нет слов.";

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

Примечание: обратите внимание на значение в левом операнде. Если это пустая строка (ложноподобное значение), то должно использовать оператор ||=, в противном случае — оператор ??= (если ожидается получение значения null или undefined).

• Логическое ИЛИ(||)
• Оператор нулевого слияния (??)
• Оператор присваивания побитового ИЛИ (|=)
• Истиноподобное значение
• Ложноподобное значение