Загрузка...

Числа в JavaScript

Вы уже знаете, что значение может быть типа number. Этот урок остаётся на этом одном типе: как писать числа, считать по-житейски, узнавать странные результаты вроде NaN и Infinity и показывать аккуратный десятичный результат на странице.

Как работают числа в JavaScript?

Для начинающих целые и дробные числа делят один тип: number. Пишите их без кавычек — 42 и 3.5 это числа; "42" — строка. Вы складываете, вычитаете, умножаете, делите и берёте остаток. Некоторые операции дают особые результаты: NaN («Not a Number»), когда расчёт не даёт полезного числа, и Infinity, когда значение выходит за конечные пределы (например деление на ноль). Для отображения toFixed строит строку с выбранным числом знаков после точки.

Числовой набор инструментов

📊 Числовые инструменты, которые новичок использует первыми

Идея Пример Результат / заметка
Целый литерал let n = 10; Целое, тип number
Дробный литерал let p = 2.5; Тот же тип number
Арифметика 10 + 3, 10 % 3 Сумма 13; остаток 1
NaN 0 / 0 или неверный расчёт «не число» — typeof всё ещё "number"
Infinity 1 / 0 За пределами конечных границ
toFixed (3.14159).toFixed(2) Строка для показа "3.14"

Пишите числа без кавычек

Целые и дробные здесь одного типа. Отдельный «тип целого» на этом уровне не нужен.

Целые и дробные литералы

javascript 
let score = 42;
let price = 9.99;
console.log(score);
console.log(price);
console.log(typeof score);
console.log(typeof price);

Повседневная арифметика

Используйте +, -, *, / и % (остаток). Модуль операторов углубит тему позже; здесь достаточно увидеть, что числа действительно считают.

Базовая арифметика с числами

javascript 
let a = 10;
let b = 3;
console.log(a + b);
console.log(a - b);
console.log(a * b);
console.log(a / b);
console.log(a % b);

NaN — не полезное число

NaN значит: результат не является полезным числом. Странность: typeof NaN всё равно "number". Если расчёт выглядит сломанным, выведите значение и ищите NaN.

NaN из неверной математики

javascript 
let broken = 0 / 0;
console.log(broken);
console.log(typeof broken);

Infinity

Деление положительного числа на ноль даёт Infinity (отрицательное делимое: -Infinity). Это реальный результат движка — полезно узнавать при отладке.

Infinity от деления на ноль

javascript 
let huge = 1 / 0;
console.log(huge);
console.log(typeof huge);

Форматирование дробей через toFixed

toFixed(n) возвращает строку с n знаками после точки — удобно для отображения «как деньги». Помните: результат — текст; дальше считайте с исходным числом, а не с отформатированной строкой.

toFixed для отображения

javascript 
let total = 19.999;
console.log(total.toFixed(2));
console.log(typeof total.toFixed(2));

Показать сумму на странице

Посчитайте сумму, при желании отформатируйте и вставьте текст на страницу через textContent.

Страница показывает вычисленную сумму

html 
<!DOCTYPE html>
<html>
<head>
<title>Numbers — total on page</title>
</head>
<body>
<p id="out">…</p>
<script>
let price = 12.5;
let tax = 1.25;
let total = price + tax;
document.getElementById("out").textContent = "Total: " + total.toFixed(2);
</script>
</body>
</html>

Абзац показывает сумму в «денежном» виде. Измените price или tax, обновите страницу и проверьте строку.

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

  1. Создайте два числовых let (целое и дробное); выведите оба и typeof.
  2. Выведите a + b, a * b и a % b для двух небольших целых.
  3. Выведите 0 / 0 и убедитесь, что видите NaN.
  4. Выведите 1 / 0 и убедитесь, что видите Infinity.
  5. Вызовите toFixed(2) у дроби; typeof результата — "string".
  6. В HTML-демо измените только price или tax, обновите и прочитайте новую сумму.

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

  • Писать let n = "10"; и ждать числовой математики — кавычки делают строку
  • Игнорировать NaN, когда в консоли результат «пустой» или странный
  • Удивляться Infinity после деления на ноль
  • Продолжать считать с результатом toFixed (это строка)
  • Ждать отдельный тип целого — у новичка один тип number

Кратко

  • Целые и дробные делят тип number; пишите без кавычек
  • Для повседневных расчётов используйте +, -, *, / и %
  • NaN и Infinity — особые числовые результаты
  • toFixed форматирует дроби для отображения и возвращает строку
  • Дальше: строки — работа с текстом подробнее

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

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

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

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

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

📝 Инструкции

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