JavaScript: проверка, является ли переменная неопределенной или нулевой

Вступление

undefinedа null все время прокрадываются в поток кода. Независимо от того, теряем ли мы ссылку из-за побочных эффектов, забываем назначить ссылочную переменную объекту в памяти или получаем пустой ответ от другого ресурса, базы данных или API – нам постоянно приходится иметь дело со значениями undefinedи null в JavaScript.

В этом кратком руководстве мы рассмотрим, как проверить, есть ли переменная undefined или null в JavaScript.

Разница между undefined и null

undefinedи null переменные часто идут рука об руку, а некоторые используют эти термины как синонимы. Хотя между ними есть разница:

  • undefined – это переменная, которая относится к чему-то, чего не существует, и переменная не определена как что-либо.
  • null – это переменная, которая определена, но не имеет значения.

Разница между ними, возможно, более ясна через код:

let a;
console.log(a); // undefined

let b = null;
console.log(b); // null

a undefined – он ни к чему не привязан, и нет четкого определения того, что это такое на самом деле. b будет определен как нулевое значение .

Было ли b это прямо определено null или определено как возвращаемое значение функции (которая просто возвращает null значение) не имеет значения – это определено как что-то .

С другой стороны, a это буквально ничего . Никакого задания не было, и совершенно неясно, что оно должно или могло бы быть.

На практике большая часть null и undefined значения возникают из человеческих ошибок при программировании, и эти два идут вместе в большинстве случаев. Проверяя одно – мы обычно проверяем и другое.

Проверка, является ли переменная неопределенной или нулевой

Есть два подхода, которые вы можете выбрать при проверке наличия переменной undefined или null в JavaScript.

Операторы == и ===

Есть разница между оператором свободного равенства ( == ) и оператором строгого равенства ( === ) в JavaScript. Свободное равенство может привести к неожиданным результатам и в этом контексте ведет себя иначе, чем оператор строгого равенства:

console.log(null == undefined);  // true
console.log(null === undefined); // false

Примечание: это не следует рассматривать как доказательство того, что null и undefined являются одним и тем же. Оператор свободного равенства использует “разговорные” определения истинных / ложных значений. 0"" и [] оцениваются, поскольку false они обозначают отсутствие данных, хотя на самом деле они не равны логическому.

При этом – поскольку оператор свободного равенства рассматривает null и undefined как одно и то же – вы можете использовать его как сокращенную версию проверки для обоих:

// Undefined variable
let a;

if (a == null) {
  console.log('Null or undefined value!');
} else {
  console.log(a);
}

Это проверит, a есть ли null или undefined . Так a как undefined это приводит к:

Null or undefined value!

Хотя мы действительно не знаем, что это такое. Если бы мы использовали строгий оператор, который проверяет, a является ли он null, мы были бы неприятно удивлены, встретив undefined значение в console.log() операторе:

let a;

if (a === null) {
  console.log('Null or undefined value!');
} else {
  console.log(a); // undefined
}

a на самом деле не является null , но есть undefined . В этом случае мы хотели бы проверить их отдельно, но при этом иметь возможность знать настоящую причину потока:

let a;

if (a === null || a === undefined) { // true
  console.log('Null or undefined value!');
} else {
  console.log(a);
}

Здесь мы объединили их вместе с помощью исключающего ИЛИ – хотя вы также можете разделить их для разных операций восстановления, если хотите:

let a;

if (a === null) {
  console.log('Null value!');
} else if (a === undefined) { // true
  console.log('Undefined value!');
}

Примечание: стоит отметить, что если ссылка не существует, ReferenceError будет выброшено. Этого можно избежать, используя typeof оператор, хотя с точки зрения разработки кода это может быть не лучший выбор. Если вы используете несуществующую ссылочную переменную – молчаливое игнорирование этой проблемы с помощью использования typeof может привести к тихому отказу в дальнейшем.

typeof Оператор

typeof Оператор дополнительно может быть использован вместе с === оператором , чтобы проверить , если тип переменной равна 'undefined' или 'null':

let a;

if (typeof a === 'undefined') {
    console.log('Undefined variable');
} else if (typeof a === 'null') {
    console.log('Null-value');
}

Это приводит к:

Undefined variable

Однако стоит отметить, что если вы забросите несуществующую ссылочную переменную –  typeof с радостью поработает с ней, рассматривая ее как undefined:

if (typeof someVar === 'undefined') {
    console.log('Undefined variable');
} else if (typeof someVar === 'null') {
    console.log('Null-value');
}

Этот код также приводит к:

Undefined variable

С технической точки зрения, some_var является неопределенной переменной, так как она не имеет никакого назначения. С другой стороны, это может typeof незаметно привести к сбою и сигнализировать о том, что входящее значение может иметь проблему, вместо того, чтобы вызывать ошибку, которая дает понять, что вы имеете дело с несуществующей переменной.

Например – представьте , что вы сделали опечатку, и случайно ввели somevariable вместо someVariable в if предложении:

let someVariable = 'Hello!'

if (typeof somevariable === 'undefined') {
    console.log('Undefined variable');
} else if (typeof somevariable === 'null') {
    console.log('Null-value');
} else {
    console.log(somevariable);
}

Здесь мы пытаемся проверить, someVariable есть ли это null или undefined. Однако из-за опечатки somevariable вместо этого проверяется, и результат:

Undefined variable

В более сложном сценарии обнаружить эту опечатку будет сложнее, чем в этом. У нас был тихий провал, и мы можем потратить время на ложный след. С другой стороны, используя только == и === операторы здесь бы уже предупредил нас о несуществующей ссылочной переменной:

let someVariable = 'Hello!'

if (somevariable === 'undefined') {
    console.log('Undefined variable');
} else if (somevariable === 'null') {
    console.log('Null-value');
} else {
    console.log(somevariable);
}

Этот код приводит к:

error: Uncaught ReferenceError: somevariable is not defined

Примечание: это не означает, что typeof это по своей сути плохой выбор, но он также влечет за собой последствия.

Использование Lodash для проверки того, имеет ли переменная значение null , undefined или nil

Наконец, вы можете выбрать внешние библиотеки помимо встроенных операторов. Хотя импорт внешней библиотеки не оправдан только для выполнения этой проверки – в этом случае вам будет лучше просто использовать операторы.

Однако Lodash уже присутствует во многих проектах – это широко используемая библиотека, и когда она уже присутствует, нет потери эффективности при использовании нескольких методов, которые она предоставляет. В частности, Lodash предлагает несколько полезных методов, которые проверяют, имеет ли переменная значение null , undefined или nil .

Установить и импортировать Lodash

Вы можете импортировать Lodash через CDN:

https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js

Импортируйте его локально из .js файла:

<script src="lodash.js"></script>

Или установите через NPM:

$ npm install lodash

Кроме того, его можно импортировать как модуль ES6 или импортировать с помощью require() синтаксиса:

import _ from 'lodash';
// OR
const _ = require('lodash');

Примечание: это соглашение называть экземпляр Lodash _, подразумеваемое именем, хотя не обязательно.

Теперь мы можем использовать библиотеку , чтобы проверить , является ли переменная nullundefined или nil – где ноль обозначает оба предыдущих двух напастей. Его можно использовать как сокращенную версию для проверки обоих:

let a = null;

console.log(_.isNull(a));       // true
console.log(_.isUndefined(a));  // false
console.log(_.isNil(a));        // true

Заключение

В этом кратком руководстве мы рассмотрели , как проверить , если переменная равна нулю, undefined или null в JavaScript, используя ===== и typeof оператор, отметив плюсы и минусы каждого подхода. Наконец, мы кратко рассмотрели использование Lodash – популярной удобной служебной библиотеки для выполнения тех же проверок.

Ответить