Как правильно проверить строку на пустое значение, null или undefined в JavaScript?

Проверка на пустую строку, null и undefined: надежный подход

Вы абсолютно правы — проверка на пустую строку, null и undefined — одна из самых частых задач в JavaScript. Давайте разберем несколько правильных подходов, от простого к лучшему.

1. Использование == (нестрогое равенство)

Самый короткий, но не всегда очевидный способ — использовать нестрогое равенство с null:

if (userName == null) {
  // userName равен null или undefined (но не пустой строке!)
}

Оператор == считает null и undefined равными друг другу. Но пустая строка "" НЕ равна null. Поэтому такой код не сработает для пустой строки.

2. Проверка на "ложные" (falsy) значения

В JavaScript есть концепция falsy значений: false, 0, "" (пустая строка), null, undefined, NaN. Если вам нужно отсечь все эти случаи, можно использовать:

if (!userName) {
  // userName — пустая строка, null, undefined, 0, false или NaN
  console.log('Значение falsy');
}

Это очень популярный подход, но у него есть важный недостаток: число 0 и булево false тоже будут считаться "пустыми". Если вы ждете именно строку, это может привести к багам.

3. Лучший универсальный способ — явная проверка типа

Самый надежный и читаемый способ — проверить, что переменная является строкой, а затем проверить ее длину:

function isEmptyString(value) {
  return typeof value === 'string' && value.length === 0;
}

// Или более короткая версия:
function isBlank(value) {
  return value === null || value === undefined || (typeof value === 'string' && value.trim().length === 0);
}

// Пример использования:
let userName = document.getElementById('name').value;

if (isBlank(userName)) {
  console.log('Имя не заполнено или пустое');
} else {
  console.log('Привет, ' + userName.trim());
}

Что здесь происходит:

• typeof value === 'string' — убеждаемся, что это строка, а не число или объект.
• value.length === 0 — проверяем, что длина строки равна нулю.
• value.trim().length === 0 — убираем пробелы и проверяем, осталось ли что-то. Это решает проблему строки из пробелов " ".
• Явные проверки на null и undefined — защита от этих типов.

4. Для современных проектов — optional chaining и nullish coalescing

Если вы работаете с объектами, где свойство может отсутствовать, используйте современные операторы:

// optional chaining (?.) — безопасный доступ к свойству
let userName = user?.name?.trim() || '';

// nullish coalescing (??) — замена только для null/undefined
let safeName = userName ?? ''; // если userName null/undefined, станет ''

if (safeName.length === 0) {
  console.log('Имя пустое');
}

Итог: какой способ выбрать?

• Для простых проверок в формах: используйте if (!value) — но помните про 0 и false.
• Для надежной проверки именно строки: напишите функцию isBlank() с typeof и trim().
• Для API и объектов: комбинируйте ?. и проверку на длину.

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

function isReallyEmpty(value) {
  if (value === null || value === undefined) return true;
  if (typeof value !== 'string') return false;
  // Проверяем, что вся строка состоит из пробелов или пустая
  return /^\s*$/.test(value);
}

// Пример:
console.log(isReallyEmpty(""));       // true
console.log(isReallyEmpty("   "));    // true
console.log(isReallyEmpty(null));     // true
console.log(isReallyEmpty("hello"));  // false