Сравнение 'typeof !== undefined' и '!= null' в JavaScript

Быстрый ответ

Для проверки переменной на отсутствие значения undefined следует использовать typeof переменная !== "undefined". Если же требуется убедиться, что переменная не равна как null, так и undefined, можно применить переменная != null. Тем не менее, последний вариант может оказаться небезопасным для необъявленных переменных. Для обеспечения надежности лучше отдать предпочтение typeof.

Пример:

if (typeof myVar !== "undefined") {
  // Код безопасен: myVar объявлена и не равна undefined.
}

if (myVar != null) {
  // Есть опасность: возникнет ошибка, если myVar не была объявлена.
  // Убедитесь в том, что myVar объявлена до использования.
}

Защита глобальных идентификаторов

Применение typeof для необъявленных переменных

Оператор typeof обеспечивает защиту от ошибок ReferenceError при работе с глобальными идентификаторами. В JavaScript undefined может быть изменено, поэтому typeof является надежной защитой, предотвращающей нежелательные подмены.

if (typeof neverDeclared === 'undefined') {
  // Надежный способ проверки на необъявленность переменной.
}

Подробнее об этом расскажет наш спикер на видео

Гарантирование неизменности 'undefined'

Во многом напоминая дело из криминальной драмы, undefined может быть подменено незаметно. Для его защиты можно использовать немедленно вызываемые функции (IIFE) или оператор void, которые обеспечат сохранение первоначального значения undefined.

// Пример с IIFE:
(function(undefined) {
  if (myVar === undefined) {
    // Переменная myVar не определена.
  }
})();

// Пример с использованием оператора void:
if (myVar === void 0) {
  // Переменная myVar не определена.
}

Упоминание стиля кодирования

Влияние на стиль и анализ кодирования

Желаете большей прозрачности в коде JavaScript? Ясность и доступность имеют огромное значение. Проверка typeof вход !== 'undefined' облегчает восприятие кода, так как соответствует стандартным практикам. В то же время проверка null != вход может ухудшить его читаемость и привести к отклонению от общепринятых стилевых правил.

Соответствие среды выполнения JavaScript

В контексте браузера разработчики могут обращаться к объекту window, избегая при этом сравнения со строковыми литералами.

if (window.myVariable === undefined) {
  // Задача выполнена: myVariable не определена или не существует.
}

Однако подобный подход становится ошибочным, если он применяется с предположением о постоянной работе в браузере, забывая о server-side JavaScript, например Node.js.

Лучшие практики при проверке на null или undefined

Проверка на undefined и null

Если вы предполагаете, что переменная может быть не передана (например, она является необязательным параметром функции), null != вход позволит обнаружить как null, так и undefined.

Заключить и победить!

Оптимальным подходом к максимальной надежности будет обертка проверок в функцию:

function isDefined(value) {
  return value !== void 0 && value !== null;
}

if (isDefined(myVar)) {
  // Обе проверки пройдены: myVar не равна null и undefined.
}

Выбор наиболее подходящих подходов

Обеспечение поддержки кода

Для улучшения поддерживаемости и читаемости кода следует избегать использования глобальных переменных. Наилучшим приемом будет использование typeof в сочетании с принципами IIFE.

Правильный выбор инструмента

Подходящий метод для выполнения задачи зависит от контекста. Если требуется проверить существование переменной, лучше применить typeof. Если задача – выявить null или undefined, следует использовать сравнение с null. Выбор метода похож на выбор между Бэтменом и Суперменом: оба эффективны, но в зависимости от ситуации предпочтительнее будет тот или иной.

Визуализация

Представьте typeof переменная !== "undefined" и переменная != null как двух охранников, контролирующих входящие данные:

Охранник 1 (`typeof`): 🔍🕸️🕸️🕸️🕸️
Захватывает: undefined
Пропускает: null, 0, '', false, NaN

Охранник 2 (`!= null`): 🚫🕸️🕸️🕸️🚫
Захватывает: undefined, null
Пропускает: 0, '', false, NaN

Стратегия патрулирования: typeof — строго фокусируется на undefined. != null — перехватывает undefined и null, пропуская другие "ложные" значения.

Полезные материалы

1. typeof – JavaScript | MDN: Подробное изучение оператора typeof.
2. null – JavaScript | MDN: Понимание концепции null в JavaScript.
3. Как проверить undefined либо null переменную в JavaScript? – Stack Overflow: Обсуждение методов проверки на undefined или null.
4. GitHub – airbnb/javascript: Руководство по стилю JavaScript: Рекомендации по стилю кодирования JavaScript от Airbnb.