Серия ES2020: нулевой оператор объединения '??'

внешний интерфейс JavaScript

Нулевой оператор объединения '??'

В этой статье мы ссылаемся на ценности, которые не являются ниnullни одинundefinedВыражение называется "определено".

Нулевой оператор объединения записывается в виде двух вопросительных знаков.??.

a ?? bРезультат:

  • еслиaопределено, результатa,
  • еслиaне определено, результатb.

Другими словами, если первый аргумент неnull/undefined,но??Вернуть первый параметр. В противном случае верните второй параметр.

В операторе объединения null нет ничего нового. Это просто хороший синтаксис для получения первого «определенного» значения из двух.

Мы можем переписать, используя наши известные операторыresult = a ?? b,так:

result = (a !== null && a !== undefined) ? a : b;

как правило??Вариант использования заключается в предоставлении значения по умолчанию для переменной, которая может быть неопределенной.

Например, здесь, еслиuserне определено, мы показываемAnonymous:

let user;

alert(user ?? "Anonymous"); // Anonymous

Конечно, еслиuserЗначение делится наnull/undefinedлюбое значение снаружи, то мы видим следующее:

let user = "John";

alert(user ?? "Anonymous"); // John

мы также можем использовать??Sequence выбирает первый не-null/undefinedценность .

Предположим, мы находимся в переменнойfirstName,lastNameилиnickNameВ нем хранятся данные пользователя. Значение всех этих переменных может быть неопределенным, если пользователь решит не вводить значение.

Мы хотим отобразить имя пользователя с помощью одной из этих переменных или «Анонимно», если все значения этих переменных не определены.

давайте использовать??оператор для достижения этого требования:

let firstName = null;
let lastName = null;
let nickName = "Supercoder";

// 显示第一个已定义的值
alert(firstName ?? lastName ?? nickName ?? "Anonymous"); // Supercoder

Сравните с ||

или оператор||можно использовать с??операторы используются одинаково. как мыпредыдущая главакак сказано.

Например, в приведенном выше коде мы можем использовать||заменять??, тот же результат также может быть получен:

let firstName = null;
let lastName = null;
let nickName = "Supercoder";

// 显示第一个真值：
alert(firstName || lastName || nickName || "Anonymous"); // Supercoder

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

С другой стороны, нулевой оператор объединения??был только недавно добавлен в JavaScript, и это произошло потому, что люди||Не так доволен.

Важными различиями между ними являются:

  • ||вернуть первыйнастоящийстоимость.
  • ??вернуть первыйопределенныйстоимость.

другими словами,||неразличимыйfalse,0, пустой строки""а такжеnull/undefined. Они все одинаковые - ложные ценности. если кто-то из них||первый параметр, то в результате мы получим второй параметр.

На практике, однако, мы можем захотеть изменить только значение переменнойnull/undefinedиспользуйте значение по умолчанию. То есть, когда значение действительно неизвестно или не установлено.

Например, рассмотрим следующую ситуацию:

let height = 0;

alert(height || 100); // 100
alert(height ?? 100); // 0
  • height || 100сначала проверюheightявляется ложным значением, найдите, что это так.
    • Итак, результатом является второй параметр,100.
  • height ?? 100сначала проверюheightЭтоnull/undefined, обнаружил, что это не так.
    • Итак, результатheightисходное значение ,0.

если высота0является допустимым значением, его не следует заменять значением по умолчанию, поэтому??можно получить правильные результаты.

приоритет

??Операторы имеют довольно низкий приоритет: вMDN tableЧжунвэй5. следовательно,??существует=а также?вычисляется до, но до большинства других операторов (например,+а также*), а затем вычисляется.

Итак, если нам нужно использовать в выражении, где есть другие операторы??Чтобы получить значение, вам нужно рассмотреть возможность добавления круглых скобок:

let height = null;
let width = null;

// 重要：使用括号
let area = (height ?? 100) * (width ?? 50);

alert(area); // 5000

В противном случае, если мы опустим скобки, так как*соотношение приоритетов??high, он будет выполняться первым, что приведет к неверным результатам.

// 没有括号
let area = height ?? 100 * width ?? 50;

// ……与下面这行代码的计算方式相同（应该不是我们所期望的）：
let area = height ?? (100 * width) ?? 50;

??а также&&или||использовать вместе

Из соображений безопасности JavaScript запрещает??оператор и&&а также||операторы вместе, если приоритет не указан явно с помощью круглых скобок.

Следующий код вызывает синтаксическую ошибку:

let x = 1 && 2 ?? 3; // Syntax error

Это ограничение, несомненно, является спорным, но оно было добавлено в спецификацию языка, чтобы избежать людей,||переключиться на??ошибка программирования.

Это можно решить, явно используя круглые скобки:

let x = (1 && 2) ?? 3; // 正常工作了

alert(x); // 2

Суммировать

  • Нулевой оператор объединения??Предоставляет простой способ выбора первого «определенного» значения из списка.

    Он используется для присвоения значений по умолчанию переменным:

    // 当 height 的值为 null 或 undefined 时，将 height 的值设置为 100
height = height ?? 100;

  • ??Операторы имеют очень низкий приоритет, лишь немного выше?а также=, поэтому рассмотрите возможность добавления круглых скобок при использовании его в выражении.

  • Его нельзя комбинировать со скобками без явного добавления скобок.||или&&использовать вместе.

Учебники по современному JavaScript: учебные пособия по современному JavaScript с открытым исходным кодом, от начального до продвинутого.Рекомендовано официальной документацией React, учебным пособием по JavaScript вместе с MDN..

Читайте онлайн бесплатно:zh.javascript.info

В WeChat найдите публичный аккаунт «Technology Talk», подпишитесь на более интересный контент:

Категории