Learn JavaScript

Преобразование типов - Number, String, Boolean и NaN

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:

  • false
  • 0 и -0
  • "" (пустая строка)
  • null
  • undefined
  • NaN

Все остальное - 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() и обрабатывать заранее.