JavaScript - If...Else: A Beginner's Guide

Здравствуйте, начинающие программисты! Сегодня мы погрузимся в один из самых fundamental concepts в программировании: оператор if...else. Представьте его как decision-maker в вашем коде, как светофор, который направляет машины на перекрестке. Пойдем же!

JavaScript - If...Else

Дерево решений if-else

Прежде чем перейти к коду, давайте visualize, как работают операторы if...else. Представьте, что вы на развилке дороги:

[Условие]
/    \
/      \
/        \
[Истина]      [Ложь]
|            |
[Действие 1]   [Действие 2]

Эта простая диаграмма показывает суть if...else: если условие истинно, делайте одно действие; в противном случае - другое.

Оператор if в JavaScript

Давайте начнем с базового оператора 'if'. Это как сказать: "Если идет дождь, возьми зонт."

let isRaining = true;

if (isRaining) {
console.log("Не забудь свой зонт!");
}

В этом примере, если isRaining истинно, сообщение будет выведено. Если ложно, ничего не произойдет. Просто, правда ли?

Давайте попробуем другой пример:

let temperature = 25;

if (temperature > 30) {
console.log("На улице жарко!");
}

Здесь сообщение появится только если температура выше 30. В этом случае ничего не будет выведено, так как 25 не больше 30.

Оператор if...else в JavaScript

Теперь, что если мы хотим сделать что-то, когда условие ложно? Вот где comes в игру 'else'. Это как сказать: "Если идет дождь, возьми зонт; в противном случае, надень солнцезащитные очки."

let isRaining = false;

if (isRaining) {
console.log("Не забудь свой зонт!");
} else {
console.log("Наслаждайся солнечным днем!");
}

В этом случае, так как isRaining ложно, второе сообщение будет выведено.

Вот еще один пример:

let age = 15;

if (age >= 18) {
console.log("Ты можешь голосовать!");
} else {
console.log("Извините, ты слишком молод, чтобы голосовать.");
}

Поскольку 15 меньше 18, сообщение "Извините, ты слишком молод, чтобы голосовать" будет отображено.

Оператор if...else if... в JavaScript

Иногда жизнь не так проста, как черное и белое. Нам нужно больше вариантов! Вот где 'else if' comes в handy. Это как multiple-choice вопрос.

let grade = 75;

if (grade >= 90) {
console.log("A - Отлично!");
} else if (grade >= 80) {
console.log("B - Хорошая работа!");
} else if (grade >= 70) {
console.log("C - Неплохо!");
} else if (grade >= 60) {
console.log("D - Тебе нужно больше учиться.");
} else {
console.log("F - О нет! Ты провалился.");
}

В этом примере, оценка 75, поэтому вывод будет "C - Неплохо!". Код проверяет каждое условие по порядку и останавливается, когда находит истинное условие.

Давайте попробуем еще один:

let time = 14;

if (time < 12) {
console.log("Доброе утро!");
} else if (time < 18) {
console.log("Добрый день!");
} else {
console.log("Добрый вечер!");
}

Поскольку время 14 (2 дня), вывод будет "Добрый день!".

Вложенные операторы if...else

Иногда вам может потребоваться проверка условий внутри условий. Вот где come в handy вложенные операторы if...else.

let isWeekend = true;
let isRaining = false;

if (isWeekend) {
if (isRaining) {
console.log("Это дождливый уикенд. Идеально для чтения книги!");
} else {
console.log("Это солнечный уикенд. Давайте пойдём на пикник!");
}
} else {
console.log("Это будний день. Время работать!");
}

В этом примере мы сначала проверяем, является ли это уикендом. Если да, то мы проверяем, идет ли дождь, чтобы решить, какое действие предложить.

Сравнительная таблица методов if...else

Вот удобная таблица, резюмирующая различные методы if...else, которые мы рассмотрели:

Метод Синтаксис Случай использования
if if (condition) { ... } Когда вы хотите execute код только если условие истинно
if...else if (condition) { ... } else { ... } Когда вы хотите одно действие, если условие истинно, и другое действие, если оно ложно
if...else if...else if (condition1) { ... } else if (condition2) { ... } else { ... } Когда у вас есть несколько условий для проверки
Вложенные if...else if (condition1) { if (condition2) { ... } else { ... } } else { ... } Когда вам нужно проверить условия внутри условий

помните, программирование - это все о практике. Не бойтесь экспериментировать с этими концепциями. Попробуйте изменить значения в примерах и посмотрите, как изменится вывод. Это лучший способ учиться!

За годы преподавания я обнаружил, что студенты, которые играют с кодом и делают ошибки, учатся最快. Так что вперед, ломайте вещи, чините их и получайте удовольствие от процесса!

Счастливого кодирования, будущие программисты!

Credits: Image by storyset