Проверка на NaN в JavaScript: использование parseFloat

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

Чтобы проверить, является ли значение NaN в JavaScript, стоит использовать функцию Number.isNaN():

if (Number.isNaN(isThisNaN)) {
  console.log('Это действительно NaN');
}

Функция Number.isNaN(yourValue) представляет собой наиболее точный способ выявления NaN, в отличие от isNaN(), которая может ошибочно квалифицировать значения других типов как NaN.

Анатомия определения NaN

NaN (Not-a-Number) — это специальное значение в JavaScript, которое обозначает нечисловую величину. Оно обладает необычными свойствами и требует особого внимания при работе.

Number.isNaN() против isNaN()

Выбор метода определения NaN зависит от контекста:

• Number.isNaN(yourValue) проверяет, истинно ли значение — NaN. Эта функция не применяет приведение типов и входит в стандарт ECMAScript 6 (ES6).

console.log(Number.isNaN(NaN)); // true
console.log(Number.isNaN('geoff')); // false

• isNaN(yourValue) применяется для определения, станет ли значение NaN после конвертации в число. Данный метод использует приведение типов.

console.log(isNaN('geoff')); // true
console.log(isNaN('100')); // false, строка '100' конвертируется в число

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

Самопроверка на NaN

Одна из особенностей NaN состоит в том, что он не равен самому себе:

• Метод самопроверки определит NaN, поскольку только этот элемент не равен самому себе:

let value = NaN;
if (value !== value) {
  console.log('Знакомьтесь с NaN!');
}

Этот подход описан в стандарте ECMAScript 5 (ES5), но он не так изящен, как Number.isNaN().

Особенности обнаружения NaN – подводные камни и пути решения

Поиск NaN в JavaScript может быть полон неожиданностей:

Слепое доверие isNaN

Применение isNaN() без дальнейшей проверки может привести к неверным результатам. Лучше всего убедиться, что значение является числом, перед использованием isNaN(), или положиться на Number.isNaN().

Нюансы работы с parseFloat

С функцией parseFloat() следует быть внимательным, так как parseFloat("geoff") возвращает NaN, но `parseFloat("123geoff") возвращает 123. Если полагаться исключительно на это, можно не добиться ожидаемого результата.

console.log(isNaN(parseFloat("geoff"))); // true
console.log(isNaN(parseFloat("123geoff"))); // false, неожиданный поворот

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

Вот игра "Угадай, кто?", чтобы распознать NaN среди различных значений JavaScript:

Число или притворщик? 🕵️‍♂️

if (Number.isNaN(value)) {
    // Вот он, маскировщик! 🎭
} else {
    // Нет, это истинное число! 🎖
}

Пример таблицы:

| Значение   | Это NaN?   |
| ---------- | ---------- |
| 42         | ❌ Нет     |
| 'banana'   | ❌ Нет     |
| undefined  | ❌ Нет     |
| NaN        | ✅ Да      |

Правильно заданный вопрос поможет раскрыть правду!

Polyfill: избавление от дилеммы Is-NaN

Если требуется поддержка старых платформ, которые не поддерживают ECMAScript 6, следует использовать polyfill для Number.isNaN(), чтобы гарантировать одинаковое поведение в разных браузерах.

if (!Number.isNaN) {
  Number.isNaN = function(value) {
    return typeof value === 'number' && isNaN(value);
  };
}

Кроссбраузерная совместимость

Функция isNaN может вести себя неконсистентно в различных браузерах, поэтому рекомендуется использовать Number.isNaN() или polyfill для достоверной проверки.

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

1. NaN – JavaScript | MDN – детальная информация о NaN в JavaScript.
2. isNaN() – JavaScript | MDN – обзор функции isNaN().
3. How do you test for NaN in JavaScript? – Stack Overflow – обсуждение различных способов определения NaN.
4. JavaScript NaN Property – краткое описание свойства NaN.
5. ECMAScript® 2024 Language Specification – спецификация, посвященная типу Number и NaN.
6. Сравнения – статья посвящена сравнению различных типов данных.
7. JavaScript loose comparison (==) step by step – аналитический обзор нестрогого сравнения в JavaScript.