Проверка на null, undefined и пустые значения в JavaScript: полный гайд

Почему проверка на null, undefined и пустоту — это боль каждого JavaScript-разработчика?

Вы когда-нибудь ловили себя на мысли: «Ну почему я снова пишу эту громоздкую конструкцию с if (x !== null && x !== undefined && x !== '')?» Если да — вы не одиноки. Вопрос «Is there a standard function to check for null, undefined, or blank variables in JavaScript?» на Stack Overflow собрал тысячи просмотров. И это не случайно.

В JavaScript нет встроенной функции, которая бы одним махом проверяла всё сразу. Но это не значит, что мы обречены на страдания. В этой статье мы разберёмся, почему такой функции нет, как элегантно обойти это ограничение, и напишем свой идеальный хелпер.

Готовы превратить хаос из проверок в чистый, понятный код? Поехали!

Что такое null, undefined и blank (пустая строка) в JavaScript?

Прежде чем искать «волшебную таблетку», давайте разберёмся, с чем мы имеем дело. Эти три понятия — три разных зверя, и путать их опасно.

• undefined — переменная объявлена, но ей не присвоено значение. Это «значение по умолчанию» от JavaScript.
• null — переменная существует, но ей намеренно присвоено «ничто». Это осознанный выбор разработчика.
• blank (пустая строка) — '' или "". Строка существует, но в ней нет символов.

Ключевая разница: null — это объект (да, это исторический баг JS, который теперь фича), undefined — специальный тип, а пустая строка — это строка.

let a; // undefined
let b = null; // null
let c = ''; // пустая строка (blank)
console.log(typeof a); // "undefined"
console.log(typeof b); // "object" (да, так и есть!)
console.log(typeof c); // "string"

Теперь представьте: вы хотите проверить, что переменная «пустая» в любом смысле. Обычная проверка if (!value) сработает для null и undefined, но не учтёт пустую строку? Нет, учтёт! Потому что пустая строка — это falsy значение. Но есть подвох...

Почему просто if (!value) — это плохая идея?

Да, if (!value) отловит null, undefined, '', 0, false и NaN. Но что если 0 или false — это допустимые значения для вашей переменной? Например, если вы проверяете количество товаров в корзине, 0 — это нормально, а не «пустота».

function processOrder(itemCount) {
    if (!itemCount) {
        console.log('Ошибка: нет товаров!');
    } else {
        console.log('Обрабатываем заказ...');
    }
}
processOrder(0); // Ошибка: нет товаров! — А это не ошибка, это 0 товаров

Вот почему нам нужна специализированная функция, а не универсальная проверка на «правдивость».

Стандартная функция? Нет, но есть стандартные паттерны

На вопрос «Is there a standard function?» ответ — нет. Но JavaScript предлагает гибкие инструменты, чтобы вы могли написать свою. И это даже лучше, потому что ваша функция будет точно соответствовать вашим бизнес-требованиям.

Вариант 1: Простейшая проверка (строгая)

Если вам нужно проверить только на null и undefined — используйте строгое сравнение (===). Это самый безопасный способ.

function isNullOrUndefined(value) {
    return value === null || value === undefined;
}

console.log(isNullOrUndefined(null)); // true
console.log(isNullOrUndefined(undefined)); // true
console.log(isNullOrUndefined('')); // false
console.log(isNullOrUndefined(0)); // false

Плюс: не путает 0 и пустую строку с «ничем». Минус: не проверяет пустые строки.

Вариант 2: Проверка на null, undefined и пустую строку

Вот та самая функция, о которой мечтают новички. Она проверяет все три состояния.

function isBlank(value) {
    return value === null || value === undefined || value === '';
}

// Или более лаконично (но менее читаемо для новичков):
const isBlank = (value) => value == null || value === '';

console.log(isBlank(null)); // true
console.log(isBlank(undefined)); // true
console.log(isBlank('')); // true
console.log(isBlank('  ')); // false — пробел не пустота!
console.log(isBlank(0)); // false
console.log(isBlank(false)); // false

Обратите внимание на value == null (с двумя равно). Это особенность JavaScript: null == undefined даёт true. Так мы покрываем оба случая одной проверкой. Но будьте осторожны: == может привести к неожиданным результатам с другими типами.

Вариант 3: Проверка на «пустоту» с учётом пробелов (blank vs empty)

Часто пользователи вводят пробелы, и это тоже считается «пустым» вводом. Если вам нужно считать строку ' ' как пустую — добавляем trim().

function isBlankOrWhitespace(value) {
    return value == null || (typeof value === 'string' && value.trim() === '');
}

console.log(isBlankOrWhitespace('   ')); // true
console.log(isBlankOrWhitespace('')); // true
console.log(isBlankOrWhitespace('a')); // false

Круто, правда? Но не переусердствуйте: если вы ожидаете число, trim() вызовет ошибку. Поэтому мы сначала проверяем тип.

Продвинутый подход: универсальный хелпер isEmpty

В реальных проектах часто нужна функция, которая проверяет «пустоту» для разных типов: массивов, объектов, строк. Давайте напишем её.

function isEmpty(value) {
    // Проверка на null и undefined
    if (value == null) return true;

    // Проверка на пустую строку (включая пробелы)
    if (typeof value === 'string') return value.trim() === '';

    // Проверка на пустой массив
    if (Array.isArray(value)) return value.length === 0;

    // Проверка на пустой объект (без собственных перечисляемых свойств)
    if (typeof value === 'object') return Object.keys(value).length === 0;

    // Для чисел, булевых значений и функций — считаем их непустыми
    return false;
}

// Тесты:
console.log(isEmpty(null)); // true
console.log(isEmpty(undefined)); // true
console.log(isEmpty('')); // true
console.log(isEmpty('  ')); // true
console.log(isEmpty([])); // true
console.log(isEmpty({})); // true
console.log(isEmpty(0)); // false
console.log(isEmpty(false));