Операторы присваивания &&= и ||= в JavaScript

JavaScript развивается быстрыми темпами, и новые возможности языка часто появляются именно для того, чтобы писать меньше кода и делать его более читаемым. Одной из таких возможностей стали логические операторы присваивания &&= и ||=, которые вошли в стандарт относительно недавно и уже поддерживаются во всех современных браузерах (статус Widely Available в Baseline с 16 марта 2023 года).

До появления этих операторов разработчики писали длинные конструкции с проверками:

let a = true;
if (a) {
  a = false;
}

Код был понятен, но избыточен. Новые операторы &&= и ||= позволяют объединить проверку и присваивание в одну строку.

Как работает &&=

Оператор &&= означает: «если переменная слева истинна (true), то присвоить ей новое значение». Пример:

let isActive = true;
isActive &&= false;
console.log(isActive); // false

Если бы isActive изначально было false, присваивание не произошло бы.

Как работает ||=

Оператор ||= означает: «если переменная слева ложна (false или другое falsy-значение), то присвоить ей новое значение». Пример:

let isLoggedIn = false;
isLoggedIn ||= true;
console.log(isLoggedIn); // true

Если переменная уже хранит true, оператор её не изменит.

Практические примеры

1. Установка значения по умолчанию:

let username = '';
username ||= 'Гость';
console.log(username); // 'Гость'

2. Деактивация состояния:

let modalOpen = true;
// Закрыть модальное окно
modalOpen &&= false;
console.log(modalOpen); // false

3. Работа с флагами:

let hasAccess = null;
// если доступа ещё нет — назначим его
hasAccess ||= true;
console.log(hasAccess); // true

Эти операторы не являются «магией», они просто сокращают уже привычные конструкции. В больших проектах они помогают убрать повторяющийся код и делают логику более наглядной. Однако новичкам важно помнить, что читаемость кода важнее краткости. Если команда ещё не знакома с синтаксисом, лучше использовать более явные конструкции if.

Операторы &&= и ||= — это удобный инструмент для работы с логикой присваивания в JavaScript. Они появились, чтобы упростить код, и теперь являются частью современного синтаксиса, доступного во всех браузерах.

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.