JavaScript умеет автоматически приводить типы, но это не всегда удобно и предсказуемо. В базовом коде чаще используют явные преобразования: Number(), String() и Boolean(). Отдельного внимания заслуживает NaN - результат неудачного превращения в число.
Явное и неявное преобразование
Явное - когда преобразование выполняется специально, через функцию:
Number("10"); // 10
String(10); // "10"
Boolean(10); // true
Неявное - когда JavaScript сам приводит типы во время операции:
"10" + 5; // "105" (склейка строк)
"10" - 5; // 5 (строка превратилась в число)
Ориентир простой: явное преобразование обычно читается легче и дает меньше сюрпризов.
Number() - превращение в число
Number(value) пытается получить число из значения.
Number("10"); // 10
Number("10.5"); // 10.5
Number(" 10 "); // 10
Number(""); // 0
Number(true); // 1
Number(false); // 0
Number(null); // 0
Number(undefined); // NaN
Если строка не похожа на число, результат будет NaN:
Number("abc"); // NaN
Number("10px"); // NaN
parseInt и parseFloat - когда в строке есть лишние символы
Number() строгий. Если нужно “вытащить” число из начала строки, используют parseInt или parseFloat.
parseInt("10px", 10); // 10
parseFloat("10.5rem"); // 10.5
Важно указывать основание системы счисления для parseInt, обычно это 10.
String() - превращение в строку
String(value) получает строковое представление значения.
String(10); // "10"
String(false); // "false"
String(null); // "null"
String(undefined); // "undefined"
Частый неявный способ - конкатенация с пустой строкой, но явный читается понятнее:
10 + ""; // "10"
String(10); // "10"
Boolean() - превращение в true/false
Boolean(value) приводит значение к логическому типу. Здесь особенно полезно понимать “ложные” значения.
Ложные значения (falsy)
В JavaScript всего несколько значений, которые становятся false при приведении к boolean:
false0и-0""(пустая строка)nullundefinedNaN
Все остальное - true.
Boolean(0); // false
Boolean(""); // false
Boolean("0"); // true
Boolean([]); // true
Boolean({}); // true
Двойное отрицание !!
Иногда встречается сокращение !!value, оно делает то же самое, что Boolean(value):
!!"text"; // true
!!0; // false
NaN - что это такое
NaN означает “Not a Number” - значение типа number, которое сигнализирует: получить корректное число не удалось.
typeof NaN; // "number"
Почему NaN особенный
NaN не равен ничему, даже самому себе:
NaN === NaN; // false
Поэтому проверять NaN через сравнение нельзя.
Как правильно проверять NaN
Надежный способ - Number.isNaN():
Number.isNaN(NaN); // true
Number.isNaN("abc"); // false (строка, не NaN)
Number.isNaN(Number("abc")); // true
Есть также глобальная isNaN, но она делает приведение типов и часто путает:
isNaN("abc"); // true (строка сначала превращается в NaN)
Number.isNaN("abc"); // false
Ориентир: для проверки использовать Number.isNaN.
Частые ситуации и безопасные решения
Значение пришло строкой, но нужно число
const inputValue = "42";
const n = Number(inputValue);
Number.isNaN(n); // false
Если нужно обработать нечисловой ввод:
const inputValue = "abc";
const n = Number(inputValue);
const safeNumber = Number.isNaN(n) ? 0 : n;
safeNumber; // 0
Склейка вместо сложения
const a = "10";
const b = "5";
a + b; // "105"
Number(a) + Number(b); // 15
Проверка “есть ли значение”
Иногда важно отличать пустую строку от реального текста:
const value = "";
Boolean(value); // false
value.trim().length > 0; // false
Быстрая памятка
- Number() - строгая попытка получить число, неудача дает
NaN - String() - безопасно превращает значение в строку
- Boolean() - приводит к true/false, важно знать falsy-значения
- Number.isNaN() - правильная проверка
NaN
Короткий итог
Преобразование типов - частая задача: данные могут приходить строками, а условия требуют boolean. Явные Number(), String() и Boolean() делают код предсказуемее. NaN полезно уметь распознавать через Number.isNaN() и обрабатывать заранее.