NaN в JavaScript: почему появляется и как правильно проверять

NaN в JavaScript — одно из тех значений, которое выглядит странно даже для разработчиков с опытом. Расшифровывается как Not-a-Number, то есть «не число», но парадокс в том, что оператор typeof считает NaN числом. В этой статье разберёмся, почему так происходит, как правильно проверять NaN и какие ошибки чаще всего встречаются в реальном коде.

Что такое NaN в JavaScript

NaN появляется, когда JavaScript ожидал получить числовой результат, но вычисление не смогло дать нормальное число. Например, если попытаться разделить строку на число или извлечь число из неподходящего текста.

console.log(0 / 0);              // NaN
console.log(Number('Привет'));    // NaN
console.log(parseInt('abc'));     // NaN
console.log(Math.sqrt(-1));       // NaN

console.log(typeof NaN);          // 'number'

Почему typeof NaN возвращает 'number'? Потому что NaN — специальное числовое значение стандарта IEEE 754, который используется для представления чисел с плавающей точкой. То есть это не ошибка языка, а особое значение внутри числового типа.

Главная особенность: NaN не равен самому себе

Самый неожиданный момент: NaN === NaN возвращает false. Это сделано намеренно: разные некорректные вычисления могут приводить к NaN, и стандарт не считает их равными.

console.log(NaN === NaN); // false
console.log(NaN == NaN);  // false

Поэтому проверка через сравнение не работает:

const result = Number('abc');

if (result === NaN) {
  console.log('Это NaN'); // этот код не выполнится
}

Как правильно проверить NaN: Number.isNaN

Современный и наиболее безопасный способ — использовать Number.isNaN(). Он возвращает true только тогда, когда значение действительно является NaN.

console.log(Number.isNaN(NaN));        // true
console.log(Number.isNaN(10));         // false
console.log(Number.isNaN('10'));       // false
console.log(Number.isNaN('Привет'));   // false
console.log(Number.isNaN(undefined));  // false

Обратите внимание: строка 'Привет' сама по себе не является NaN. Она становится NaN только после попытки преобразования в число.

const value = Number('Привет');

console.log(value);                  // NaN
console.log(Number.isNaN(value));    // true

isNaN vs Number.isNaN: важная разница

В JavaScript есть старая глобальная функция isNaN(). Она сначала пытается преобразовать значение к числу, а уже потом проверяет результат. Из-за этого поведение может быть неожиданным.

console.log(isNaN('Привет'));   // true
console.log(isNaN(undefined));  // true
console.log(isNaN({}));         // true

console.log(Number.isNaN('Привет'));   // false
console.log(Number.isNaN(undefined));  // false
console.log(Number.isNaN({}));         // false

Если говорить просто: isNaN(value) отвечает на вопрос «станет ли значение NaN после преобразования в число?», а Number.isNaN(value) отвечает на вопрос «является ли значение именно NaN прямо сейчас?».

Практический пример: проверка числового поля

Допустим, пользователь вводит возраст в поле формы. Значение из input всегда приходит строкой, поэтому его нужно явно преобразовать.

function parseAge(inputValue) {
  const age = Number(inputValue);

  if (Number.isNaN(age)) {
    return 'Введите число';
  }

  if (age < 0 || age > 120) {
    return 'Возраст должен быть от 0 до 120';
  }

  return `Возраст: ${age}`;
}

console.log(parseAge('25'));     // Возраст: 25
console.log(parseAge('abc'));    // Введите число
console.log(parseAge('150'));    // Возраст должен быть от 0 до 120

Такой подход лучше, чем просто проверять if (!age), потому что значение 0 тоже считается ложным, хотя это корректное число.

const age = 0;

if (!age) {
  console.log('Ошибка'); // выполнится, хотя 0 может быть допустимым значением
}

Когда лучше использовать Number.isFinite

Иногда нужно проверить не только NaN, но и бесконечность. Например, результат деления на ноль — это не NaN, а Infinity.

console.log(10 / 0);                 // Infinity
console.log(Number.isNaN(10 / 0));    // false
console.log(Number.isFinite(10 / 0)); // false
console.log(Number.isFinite(25));     // true

Если вам нужно убедиться, что значение — нормальное конечное число, используйте связку typeof и Number.isFinite() либо просто Number.isFinite(), если значение уже должно быть числом.

function isValidNumber(value) {
  return typeof value === 'number' && Number.isFinite(value);
}

console.log(isValidNumber(10));       // true
console.log(isValidNumber(NaN));      // false
console.log(isValidNumber(Infinity)); // false
console.log(isValidNumber('10'));     // false

Короткий трюк: value !== value

Так как NaN — единственное значение в JavaScript, которое не равно самому себе, его можно проверить так:

function isReallyNaN(value) {
  return value !== value;
}

console.log(isReallyNaN(NaN)); // true
console.log(isReallyNaN(123)); // false

Но в обычном коде лучше использовать Number.isNaN(): он понятнее для команды и явно показывает намерение.

Частые причины появления NaN

• Некорректное преобразование строки: Number('abc').
• Математическая операция с неподходящим значением: 'text' * 2.
• Ошибки при чтении данных из формы: пустые или текстовые значения.
• Неверный парсинг чисел: например, строка с запятой '12,5'.
• Недопустимые математические операции: Math.sqrt(-1).

Советы и лучшие практики

• Используйте Number.isNaN() вместо сравнения с NaN.
• Не проверяйте число через if (!value), если ноль является допустимым значением.
• После получения данных из формы явно преобразуйте строку в число.
• Для проверки «нормального» числа используйте Number.isFinite().
• Будьте осторожны с parseInt и parseFloat: они могут частично разобрать строку.

console.log(parseInt('100px'));   // 100
console.log(Number('100px'));     // NaN

Если вы хотите глубже разобраться в базовых механизмах языка, типах данных, функциях, DOM и современной практике разработки, посмотрите курс «JavaScript с нуля до уверенного уровня: практический курс». Он хорошо подходит тем, кто хочет не просто копировать примеры, а понимать, почему код работает именно так.

Итог

NaN в JavaScript — это специальное числовое значение, которое появляется при неудачных вычислениях или преобразованиях. Оно не равно самому себе, поэтому проверять его через === нельзя. В большинстве случаев используйте Number.isNaN(), а для проверки корректного конечного числа — Number.isFinite(). Это сделает ваш код понятнее, надёжнее и избавит от многих скрытых ошибок.