Elementor Header #8

6. Операторы

Операторы в JavaScript используются для выполнения операций над значениями и переменными. В этом уроке мы рассмотрим различные виды операторов, их синтаксис и примеры использования.

Виды операторов

  1. Арифметические операторы
  2. Операторы присваивания
  3. Сравнительные операторы
  4. Логические операторы
  5. Операторы строк
  6. Условный (тернарный) оператор
Арифметические операторы

Арифметические операторы выполняют математические вычисления.

				
					let a = 10;
let b = 5;

console.log(a + b); // 15 (сложение)
console.log(a - b); // 5 (вычитание)
console.log(a * b); // 50 (умножение)
console.log(a / b); // 2 (деление)
console.log(a % b); // 0 (остаток от деления)
console.log(a ** b); // 100000 (возведение в степень)

				
			
Операторы присваивания

Операторы присваивания используются для присвоения значений переменным.

				
					let x = 10;
x += 5; // эквивалентно x = x + 5
console.log(x); // 15

x -= 3; // эквивалентно x = x - 3
console.log(x); // 12

x *= 2; // эквивалентно x = x * 2
console.log(x); // 24

x /= 4; // эквивалентно x = x / 4
console.log(x); // 6

x %= 5; // эквивалентно x = x % 5
console.log(x); // 1

x **= 3; // эквивалентно x = x ** 3
console.log(x); // 1

				
			
Сравнительные операторы

Сравнительные операторы используются для сравнения значений.

				
					let a = 10;
let b = 5;

console.log(a > b); // true (больше)
console.log(a < b); // false (меньше)
console.log(a >= b); // true (больше или равно)
console.log(a <= b); // false (меньше или равно)
console.log(a == b); // false (равно)
console.log(a != b); // true (не равно)
console.log(a === b); // false (строгое равенство)
console.log(a !== b); // true (строгое неравенство)

				
			
Логические операторы

Логические операторы используются для логических операций.

				
					let a = true;
let b = false;

console.log(a && b); // false (логическое И)
console.log(a || b); // true (логическое ИЛИ)
console.log(!a); // false (логическое НЕ)

				
			
Операторы строк

Оператор + используется для объединения (конкатенации) строк.

				
					let str1 = "Привет, ";
let str2 = "Мир!";
let message = str1 + str2; // "Привет, Мир!"
console.log(message);

				
			
Условный (тернарный) оператор

Условный оператор позволяет выполнять одну из двух операций в зависимости от условия.

				
					let age = 18;
let message = (age >= 18) ? "Взрослый" : "Не взрослый";
console.log(message); // "Взрослый"

				
			

Пример: Использование различных операторов

Создадим пример, который демонстрирует использование различных операторов.

HTML:

				
					<!DOCTYPE html>
<html>
<head>
    <title>Операторы в JavaScript</title>
    <script>
        let a = 10;
        let b = 5;

        // Арифметические операторы
        console.log("Арифметические операторы");
        console.log("Сложение: " + (a + b));
        console.log("Вычитание: " + (a - b));
        console.log("Умножение: " + (a * b));
        console.log("Деление: " + (a / b));
        console.log("Остаток от деления: " + (a % b));
        console.log("Возведение в степень: " + (a ** b));

        // Операторы присваивания
        console.log("Операторы присваивания");
        let x = 10;
        x += 5;
        console.log("x += 5: " + x);
        x -= 3;
        console.log("x -= 3: " + x);
        x *= 2;
        console.log("x *= 2: " + x);
        x /= 4;
        console.log("x /= 4: " + x);
        x %= 5;
        console.log("x %= 5: " + x);
        x **= 3;
        console.log("x **= 3: " + x);

        // Сравнительные операторы
        console.log("Сравнительные операторы");
        console.log("a > b: " + (a > b));
        console.log("a < b: " + (a < b));
        console.log("a >= b: " + (a >= b));
        console.log("a <= b: " + (

				
			

Распространённые ошибки

  • Использование оператора == вместо ===: Оператор == проверяет равенство без учёта типа данных, что может привести к неожиданным результатам. Всегда используйте === для строгого сравнения.

				
					console.log(1 == '1'); // true
console.log(1 === '1'); // false

				
			
  • Забытые скобки при использовании операторов: При выполнении операций с несколькими операторами не забывайте использовать скобки для определения порядка выполнения операций.
				
					let result = 1 + 2 * 3; // результат будет 7, а не 9
let correctResult = (1 + 2) * 3; // результат будет 9

				
			
  • Неправильное использование логических операторов: Убедитесь, что логические операторы используются правильно в условиях.

				
					let isLoggedIn = true;
let hasAccess = false;

if (isLoggedIn && hasAccess) {
    console.log("Доступ разрешен");
} else {
    console.log("Доступ запрещен");
}

				
			

Заключение

Операторы являются основой для выполнения различных операций в JavaScript. Понимание и правильное использование операторов поможет вам писать более эффективный и понятный код.

Тестовое задание

  • Напишите код, который выполняет следующие операции и выводит результаты в консоль:
    • Сложение, вычитание, умножение и деление двух чисел.
    • Присваивание значения переменной и изменение его с использованием операторов присваивания.
    • Сравнение двух чисел с использованием всех сравнительных операторов.
    • Логические операции с использованием значений true и false.
    • Конкатенация двух строк.
    • Использование условного (тернарного) оператора для проверки возраста и вывода сообщения «Совершеннолетний» или «Несовершеннолетний».

Пример выполнения:

				
					let a = 8;
let b = 4;

console.log("Сложение: " + (a + b)); // 12
console.log("Вычитание: " + (a - b)); // 4
console.log("Умножение: " + (a * b)); // 32
console.log("Деление: " + (a / b)); // 2

let x = 10;
x += 5;
console.log("x += 5: " + x); // 15

console.log("a > b: " + (a > b)); // true
console.log("a < b: " + (a < b)); // false
console.log("a >= b: " + (a >= b)); // true
console.log("a <= b: " + (a <= b)); // false
console.log("a == b: " + (a == b)); // false
console.log("a != b: " + (a != b)); // true
console.log("a === b: " + (a === b)); // false
console.log("a !== b: " + (a !== b)); // true

let isTrue = true;
let isFalse = false;
console.log("isTrue && isFalse: " + (isTrue && isFalse)); // false
console.log("isTrue || isFalse: " + (isTrue || isFalse)); // true
console.log("!isTrue: " + (!isTrue)); // false

let greeting = "Привет, ";
let name = "Мир!";
console.log(greeting + name); // "Привет, Мир!"

let age = 16;
let message = (age >= 18) ? "Совершеннолетний" : "Несовершеннолетний";
console.log(message); // "Несовершеннолетний"

				
			
Этот урок поможет вам освоить различные виды операторов в JavaScript, что является важным навыком для написания эффективного и функционального кода.
logo