Загрузка...

Преобразование типов

Вы уже различаете null и undefined. Дальше — намеренно менять тип значения: число в текст для подписи, текст в число для счёта. Это преобразование типов. Здесь три явных помощника: String(), Number() и Boolean() — плюс частый сюрприз с +.

Что такое преобразование типов в JavaScript?

Преобразование типов — перевод значения из одного вида в другой. Лучше явно: String(42) даёт "42", Number("7") — 7, Boolean(0) — false. Если Number не понимает текст, получается NaN. При +, если с одной стороны строка, часто идёт склейка текста, а не сложение — залогируйте один раз.

Набор инструментов преобразования

📊 Преобразование типов для начинающих

Помощник / идея Пример Результат / заметка
String(...) String(42) "42" (текст)
Number(...) Number("7") 7 (число)
Boolean(...) Boolean(0) false (превью falsy)
Нечисловой текст Number("hello") NaN — typeof всё ещё "number"
Пустое → boolean Boolean("") false
Смесь с + 5 + "2" "52" (конкатенация, не 7)

String() — сделать текст

Нужна подпись или сообщение — оберните значение в String(...). Числа, булевы, null и undefined становятся строками.

преобразования String()

javascript 
console.log(String(42));
console.log(String(true));
console.log(String(null));
console.log(String(undefined));
console.log(typeof String(42));

Number() — сделать число

Когда текст нужен для арифметики, используйте Number(...). Строки из цифр преобразуются чисто. Нечисловой текст даёт NaN.

преобразования Number()

javascript 
console.log(Number("7"));
console.log(Number("3.5"));
console.log(Number(true));
console.log(Number(false));
console.log(typeof Number("7"));

Когда Number не срабатывает — NaN

Number("hello") — это NaN. Из урока про числа: typeof NaN всё ещё "number". Считайте NaN неудачным преобразованием, а не полезной величиной.

ловушка Number становится NaN

javascript 
console.log(Number("hello"));
console.log(typeof Number("hello"));
console.log(Number(""));
console.log(Number(null));

Number("") и Number(null) дают 0 — ещё одна ловушка. Для реальной суммы давайте явную цифровую строку.

Boolean() — да/нет из значения

Boolean(...) превращает значение в true или false. Пустые вроде 0, "", null, undefined и NaN становятся false. Непустые строки и большинство чисел — true. Полный список truthy / falsy — в следующем уроке; здесь достаточно помощника.

преобразования Boolean()

javascript 
console.log(Boolean(1));
console.log(Boolean(0));
console.log(Boolean("hi"));
console.log(Boolean(""));
console.log(Boolean(null));

Сюрприз + — склейка или сложение

Если один операнд + — строка, JavaScript часто склеивает текст. Для математики сначала преобразуйте через Number().

плюс может склеивать

javascript 
console.log(5 + 2);
console.log(5 + "2");
console.log(Number("5") + Number("2"));
console.log("Score: " + 10);

Показать преобразования на странице

Преобразуйте несколько значений и запишите короткие подписи через textContent.

Подписи страницы после преобразования

html 
<!DOCTYPE html>
<html>
<head>
<title>Type conversion — labels</title>
</head>
<body>
<p id="out">…</p>
<script>
let raw = "12";
let asNumber = Number(raw);
let asText = String(asNumber);
let flag = Boolean(asNumber);
document.getElementById("out").textContent =
"raw=" + raw +
" | number=" + asNumber +
" | text=" + asText +
" | flag=" + flag;
</script>
</body>
</html>

Абзац показывает одну идею в трёх видах. Поставьте raw в "0", обновите страницу: flag станет false, а число останется 0.

Попробуйте сами

  1. Залогируйте String(99), String(false) и typeof String(99).
  2. Залогируйте Number("8") и Number("8") + 2 — арифметика, не "82".
  3. Залогируйте Number("oops") и typeof (NaN, всё ещё "number").
  4. Залогируйте Boolean("") и Boolean("ok").
  5. Залогируйте 3 + "4", затем перепишите через Number("3") + Number("4").
  6. В HTML-демо raw = "0", обновите и прочитайте новый flag.

Частые ошибки

  • Думать, что + всегда складывает — строка может склеить
  • Игнорировать NaN после Number("hello") и считать дальше
  • Считать, что этот урок заменяет truthy / falsy — Boolean() лишь превью
  • Ожидать, что String(null) — это ""; на деле текст "null"
  • Забывать typeof, когда результат странный

Кратко

  • Преобразование типов: намеренно менять вид значения
  • Для ясности предпочитайте String(), Number(), Boolean()
  • Нечисловой текст → NaN; typeof NaN всё ещё "number"
  • + со строкой часто склеивает — преобразуйте перед сложением
  • Дальше: truthy и falsy — какие значения в условиях ведут себя как true или false

🧠 Проверьте Свои Знания

Готов к Началу

Проверьте Свои Знания

Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему

❓
8
Вопросы
🎯
70%
Для Прохождения
♾️
∞
Время
🔄
∞
Попытки

📝 Инструкции

  • Внимательно прочитайте каждый вопрос
  • Выберите лучший ответ на каждый вопрос
  • Вы можете пересдавать тест столько раз, сколько захотите
  • Ваш прогресс будет показан вверху
Тема 14 из 16
Javascript Урок