Арифметика в JavaScript
Карта семейств операторов у вас уже есть. Этот урок углубляется в арифметическое семейство — символы, которые в основном работают с числами и возвращают новое значение. Вы потренируете + - * / %, порядок через скобки, счётчики с ++ и --, степень через оператор степени и классическую ловушку: когда + склеивает текст вместо сложения.
Что такое арифметические операторы?
Арифметические операторы говорят JavaScript: посчитай. Значения по-прежнему называют операндами. В 12 / 4 / — оператор, а 12 и 4 — операнды. Результат можно сохранить, вывести в консоль или показать на странице.
Пять повседневных операторов
📊 Повседневные арифметические операторы
| Оператор | Задача | Пример результата |
|---|---|---|
+ |
сложить | 7 + 3 → 10 |
- |
вычесть | 7 - 3 → 4 |
* |
умножить | 7 * 3 → 21 |
/ |
разделить | 7 / 2 → 3.5 |
% |
остаток от деления | 7 % 3 → 1 |
Держите эту таблицу под рукой. / может дать дробь. % — это не «проценты», а остаток.
console.log(20 + 4);
console.log(20 - 4);
console.log(20 * 4);
console.log(20 / 4);
console.log(20 % 4);
console.log(20 / 3);
Шаблоны остатка с %
% отвечает: «что осталось после деления?» Этот остаток полезен для чётности и логики «каждый N-й».
console.log(8 % 2);
console.log(9 % 2);
console.log(15 % 5);
console.log(17 % 5);
let n = 12;
console.log(n % 2 === 0);
8 % 2 даёт 0 (чётное). 9 % 2 даёт 1 (нечётное). Частая проверка чётности: n % 2 === 0. Позже остаток пригодится в циклах; здесь достаточно уметь его читать.
Приоритет и скобки
JavaScript не всегда считает строго слева направо. Умножение и деление обычно идут раньше сложения и вычитания. Скобки задают нужный порядок — сначала читайте внутренность (…).
console.log(2 + 3 * 4);
console.log((2 + 3) * 4);
console.log(10 - 6 / 2);
console.log((10 - 6) / 2);
Без скобок 2 + 3 * 4 равно 14 (сначала умножение). С (2 + 3) * 4 получается 20. Если порядок важен для цены или формулы, пишите скобки намеренно.
++ -- и оператор степени
++ увеличивает числовую переменную на один. -- уменьшает на один. оператор степени — возведение в степень. Пока неудобно — нормальна и строка n = n + 1; ++ часто встретится в циклах.
let lives = 3;
lives++;
console.log(lives);
lives--;
console.log(lives);
console.log(2 ** 3);
console.log(5 ** 2);
После lives++ значение станет 4. 2 в степени 3 равно 8. 5 в степени 2 равно 25. Сокращения вроде += — в уроке о присваивании; здесь остаёмся на вычислительных символах.
Когда + склеивает вместо сложения
Если одна сторона + — строка, JavaScript часто склеивает. Преобразуйте через Number(...), когда нужно именно сложить числа.
console.log("5" + 2);
console.log(Number("5") + 2);
console.log(5 + Number("2"));
let a = "10";
let b = "3";
console.log(Number(a) + Number(b));
"5" + 2 даёт "52". Number("5") + 2 даёт 7. Та же идея преобразования типов — постоянно во формах и тексте страницы.
Показать итог на странице
Посчитайте небольшой счёт, используйте остаток как подсказку и запишите результат на страницу.
<!DOCTYPE html>
<html>
<head>
<title>Arithmetic — page total</title>
</head>
<body>
<p id="out">…</p>
<script>
let price = 12;
let qty = 3;
let shipping = 4;
let total = price * qty + shipping;
let leftover = total % 5;
let box = document.getElementById("out");
box.textContent = "total=" + total + " · rem5=" + leftover;
</script>
</body>
</html>
Здесь * выполняется раньше +, поэтому 12 * 3 + 4 → 40. 40 % 5 равно 0. Меняйте price, qty или shipping, обновляйте страницу и проверяйте оба числа.
Попробуйте сами
- Выведите
14 + 5,14 - 5,14 * 5,14 / 5и14 % 5. - Проверьте чётность
22через%и=== 0. - Сравните
1 + 2 * 3и(1 + 2) * 3. - Начните с
let c = 0, дважды выполнитеc++, затем выведитеc. - Выведите 3 в степени 3 и
Number("8") + 1. - В HTML-демо измените только
qty, обновите и прочитайте новый итог и остаток.
Частые ошибки
- Читать
%как «процент» — это остаток - Ждать, что
+всегда складывает — строковая сторона часто склеивает - Забывать скобки, когда
*//не должны побеждать - Путать
++(изменить на один) с=(сохранить любое значение) - Считать по строкам отображения вместо сырых чисел
Кратко
- Арифметика:
+-*/% %— остаток; полезен для чётности и «каждый N-й»- Скобки управляют приоритетом; обычно
*/раньше+- ++/--меняют на один; оператор степени возводит в степень- Используйте
Number(), когда+склеивает - Далее: присваивание — сохранение и обновление через
=и компанию
🧠 Проверьте Свои Знания
Проверьте Свои Знания
Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему
📝 Инструкции
- Внимательно прочитайте каждый вопрос
- Выберите лучший ответ на каждый вопрос
- Вы можете пересдавать тест столько раз, сколько захотите
- Ваш прогресс будет показан вверху