В целом есть два типа важных проверок null или falsey, которые вы будете использовать в JavaScript:

  • Логическое ИЛИ (||)
  • Нулевое слияние (??)

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

Гипотетической ситуацией может быть получение значения из асинхронного вызова. Возможно, вы решили получить информацию о профиле пользователя на основе параметра URL. Что делать, если пользователь вводит неправильный URL-адрес? В такой ситуации можно выполнить проверку null или false и вернуть что-то более полезное.

Пример:

// These params might look like https://example.com/:user
const userName = match.params.user;

// I want to fetch the user based on the user params in the url
// Sometimes this wouldn't return a user if the user did not exist!
const response = await fetchUserProfileFromUrlParam(userName);

// Here if my response was not successful, instead of returning undefined,
// I could return an empty object instead
const userData = response.success && response.data ?? {}

Это всего лишь случайный сценарий, помогающий лучше понять, почему мы можем использовать проверку null. Давайте углубимся в то, что объединение нулей и логическое ИЛИ немного глубже.

Логическое ИЛИ ( || )

  • Если левая часть || неверна, будет использоваться правая сторона.
  • Логическое ИЛИ включает в себя больше, чем undefined и null.Оно включает 0, NaN и "" (пустые строки)
  • Ссылка на документы MDN в логическом ИЛИ ||
const value1 = '';
const myValue = value1 || 'Hello World'; // Hello World

const value2 = 0;
const myValue2 = value2 || 200; // 200

const value3 = undefined;
const myValue3 = value3 || 'Boom!'; // Boom!

const value4 = null;
const myValue4 = value4 || await myAsyncCall(); // data from async call

Нулевая коалесценция ( ?? )

const value1 = null;
const myValue1 = value1 ?? 'Hello World'; // Hello World

const myObj = {
   text: 'Hello World'
}

const value2 = myObj.anotherValue; // undefined
const myValue2 = value2 ?? 'Boom!'; // boom

Спасибо за прочтение! Оставайтесь на связи со мной через мой Github или LinkedIn:



blakewood84 — Обзор
Вы не можете выполнить это действие в данный момент. Вы вошли в другую вкладку или окно. Вы вышли на другой вкладке или…github.com



LinkedIn: https://www.linkedin.com/in/blakewoodjr/

😎👋🏽