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

Введение

Добро пожаловать в лабораторию "Операторы и выражения в JavaScript". На этом практическом занятии вы познакомитесь с фундаментальными строительными блоками программирования на JavaScript: операторами и выражениями. Операторы — это специальные символы, используемые для выполнения операций над значениями (операндами), а выражение — это любая единица кода, которая вычисляется в значение.

Вы начнете с базовых арифметических операторов, таких как сложение, вычитание, умножение и деление. Затем вы узнаете, как оператор сложения также может использоваться для объединения строк, процесс, известный как конкатенация. Наконец, вы познакомитесь с удобным оператором инкремента. К концу этой лаборатории вы сможете выполнять базовые операции с данными в JavaScript.

Используйте оператор сложения для чисел

На этом шаге вы научитесь использовать оператор сложения (+) для выполнения сложения чисел. Это одна из наиболее распространенных арифметических операций.

Ваша лабораторная среда уже настроена с файлом index.html и файлом script.js в каталоге ~/project. Весь наш JavaScript-код будет написан в файле script.js.

Сначала найдите файл script.js в файловом проводнике слева на экране. Щелкните по нему, чтобы открыть в редакторе.

Теперь добавьте следующий код в script.js. Этот код объявляет две числовые переменные, складывает их и использует console.log() для вывода результата в консоль разработчика браузера.

// Step 1: Addition
let num1 = 10;
let num2 = 5;
let sum = num1 + num2;
console.log("The sum is:", sum);

После добавления кода сохраните файл, нажав Ctrl+S.

Чтобы увидеть вывод, перейдите на вкладку Web 8080 в верхней части интерфейса. Затем откройте консоль разработчика, нажав F12 или щелкнув правой кнопкой мыши на странице, выбрав "Inspect" (Проверить), а затем перейдя на вкладку "Console" (Консоль). Вы должны увидеть сообщение The sum is: 15.

Примените операторы вычитания и умножения

На этом шаге вы примените операторы вычитания (-) и умножения (*). Они работают так же, как оператор сложения, но выполняют другие вычисления.

Продолжайте редактировать файл ~/project/script.js. Добавьте следующие строки кода под существующим кодом, чтобы вычислить разность и произведение тех же двух чисел.

// Step 2: Subtraction and Multiplication
let difference = num1 - num2;
console.log("The difference is:", difference);

let product = num1 * num2;
console.log("The product is:", product);

Снова сохраните файл (Ctrl+S). Обновите вкладку Web 8080 (вы можете использовать кнопку обновления на вкладке). Консоль разработчика теперь покажет результаты сложения, вычитания и умножения.

Реализуйте операторы деления и остатка от деления

На этом шаге мы рассмотрим операторы деления (/) и получения остатка (%). Оператор деления выполняет стандартное деление, а оператор получения остатка возвращает остаток от деления. Это полезно для таких задач, как определение четности или нечетности числа.

Добавьте следующий код в конец вашего файла ~/project/script.js.

// Step 3: Division and Modulus
let quotient = num1 / num2;
console.log("The quotient is:", quotient);

let remainder = num1 % 3; // Using 3 to get a non-zero remainder
console.log("The remainder of 10 divided by 3 is:", remainder);

Сохраните файл и обновите вкладку Web 8080. Проверьте консоль, чтобы увидеть новый вывод для деления и остатка. Вы должны увидеть, что частное равно 2, а остаток равен 1.

Конкатенируйте строки с помощью оператора плюс

На этом шаге вы увидите другое применение оператора +: конкатенацию строк. При использовании со строками оператор + объединяет их, создавая новую, более длинную строку.

Создадим две строковые переменные и объединим их. Добавьте этот код в конец файла ~/project/script.js.

// Step 4: String Concatenation
let firstName = "Hello";
let lastName = "World";
let fullName = firstName + " " + lastName;
console.log(fullName);

В приведенном выше примере мы объединяем firstName, пробел " " и lastName, чтобы сформировать полную фразу.

После сохранения файла обновите вкладку Web 8080. Консоль теперь отобразит объединенную строку: Hello World.

Увеличьте переменную с помощью оператора ++

На этом заключительном шаге вы узнаете об операторе инкремента (++). Это унарный оператор, что означает, что он работает с одним операндом. Это удобное сокращение для добавления 1 к числовой переменной, что является очень распространенной операцией в циклах и счетчиках.

Добавьте следующий код в конец файла ~/project/script.js, чтобы увидеть его в действии.

// Step 5: Increment Operator
let counter = 0;
counter++; // This is equivalent to counter = counter + 1;
console.log("The counter value is:", counter);

Сохраните файл в последний раз и обновите вкладку Web 8080. Консоль покажет конечное значение счетчика, которое должно быть 1.

Резюме

Поздравляем с завершением этой лабораторной работы!

В этой лабораторной работе вы изучили основы операторов и выражений JavaScript. Вы практиковались в использовании:

• Арифметических операторов для базовых математических операций: + (сложение), - (вычитание), * (умножение), / (деление) и % (остаток от деления).
• Оператора + для конкатенации строк, чтобы объединять текст.
• Оператора инкремента ++ как сокращения для увеличения значения числа на единицу.

Эти операторы являются основными строительными блоками в JavaScript и используются практически в каждой программе. Теперь вы готовы к более сложной логике и функциональности в своих будущих проектах.