Вложенные if else javascript

Условное ветвление: if, ‘?’

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

Для этого мы можем использовать инструкцию if и условный оператор ? , который также называют оператором «вопросительный знак».

Инструкция «if»

Инструкция if(. ) вычисляет условие в скобках и, если результат true , то выполняет блок кода.

let year = prompt('В каком году была опубликована спецификация ECMAScript-2015?', ''); if (year == 2015) alert( 'Вы правы!' );

В примере выше, условие – это простая проверка на равенство ( year == 2015 ), но оно может быть и гораздо более сложным.

Если мы хотим выполнить более одной инструкции, то нужно заключить блок кода в фигурные скобки:

Мы рекомендуем использовать фигурные скобки <> всегда, когда вы используете инструкцию if , даже если выполняется только одна команда. Это улучшает читаемость кода.

Преобразование к логическому типу

Инструкция if (…) вычисляет выражение в скобках и преобразует результат к логическому типу.

Давайте вспомним правила преобразования типов из главы Преобразование типов:

• Число 0 , пустая строка «» , null , undefined и NaN становятся false . Из-за этого их называют «ложными» («falsy») значениями.
• Остальные значения становятся true , поэтому их называют «правдивыми» («truthy»).

Таким образом, код при таком условии никогда не выполнится:

…а при таком – выполнится всегда:

Мы также можем передать заранее вычисленное в переменной логическое значение в if , например так:

let condition = (year == 2015); // преобразуется к true или false if (condition)

Блок «else»

Инструкция if может содержать необязательный блок «else» («иначе»). Он выполняется, когда условие ложно.

let year = prompt('В каком году была опубликована спецификация ECMAScript-2015?', ''); if (year == 2015) < alert( 'Да вы знаток!' ); >else < alert( 'А вот и неправильно!' ); // любое значение, кроме 2015 >

Несколько условий: «else if»

Иногда нужно проверить несколько вариантов условия. Для этого используется блок else if .

let year = prompt('В каком году была опубликована спецификация ECMAScript-2015?', ''); if (year < 2015) < alert( 'Это слишком рано. ' ); >else if (year > 2015) < alert( 'Это поздновато' ); >else

В приведённом выше коде JavaScript сначала проверит year < 2015 . Если это неверно, он переходит к следующему условию year >2015 . Если оно тоже ложно, тогда сработает последний alert .

Блоков else if может быть и больше. Присутствие блока else не является обязательным.

Условный оператор „?“

Иногда нам нужно определить переменную в зависимости от условия.

let accessAllowed; let age = prompt('Сколько вам лет?', ''); if (age > 18) < accessAllowed = true; >else < accessAllowed = false; >alert(accessAllowed);

Так называемый «условный» оператор «вопросительный знак» позволяет нам сделать это более коротким и простым способом.

Оператор представлен знаком вопроса ? . Его также называют «тернарный», так как этот оператор, единственный в своём роде, имеет три аргумента.

let result = условие ? значение1 : значение2;

Сначала вычисляется условие : если оно истинно, тогда возвращается значение1 , в противном случае – значение2 .

let accessAllowed = (age > 18) ? true : false;

Технически, мы можем опустить круглые скобки вокруг age > 18 . Оператор вопросительного знака имеет низкий приоритет, поэтому он выполняется после сравнения > .

Этот пример будет делать то же самое, что и предыдущий:

// оператор сравнения "age > 18" выполняется первым в любом случае // (нет необходимости заключать его в скобки) let accessAllowed = age > 18 ? true : false;

Но скобки делают код более простым для восприятия, поэтому мы рекомендуем их использовать.

В примере выше вы можете избежать использования оператора вопросительного знака ? , т.к. сравнение само по себе уже возвращает true/false :

// то же самое let accessAllowed = age > 18;

Несколько операторов „?“

Последовательность операторов вопросительного знака ? позволяет вернуть значение, которое зависит от более чем одного условия.

let age = prompt('Возраст?', 18); let message = (age < 3) ? 'Здравствуй, малыш!' : (age < 18) ? 'Привет!' : (age < 100) ? 'Здравствуйте!' : 'Какой необычный возраст!'; alert( message );

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

Вот как это выглядит при использовании if..else :

if (age < 3) < message = 'Здравствуй, малыш!'; >else if (age < 18) < message = 'Привет!'; >else if (age < 100) < message = 'Здравствуйте!'; >else

Нетрадиционное использование „?“

Иногда оператор «вопросительный знак» ? используется в качестве замены if :

let company = prompt('Какая компания создала JavaScript?', ''); (company == 'Netscape') ? alert('Верно!') : alert('Неправильно.');

В зависимости от условия company == 'Netscape' , будет выполнена либо первая, либо вторая часть после ? .

Здесь мы не присваиваем результат переменной. Вместо этого мы выполняем различный код в зависимости от условия.

Не рекомендуется использовать оператор вопросительного знака таким образом.

Несмотря на то, что такая запись короче, чем эквивалентная инструкция if , она хуже читается.

Вот, для сравнения, тот же код, использующий if :

let company = prompt('Какая компания создала JavaScript?', ''); if (company == 'Netscape') < alert('Верно!'); >else

При чтении глаза сканируют код по вертикали. Блоки кода, занимающие несколько строк, воспринимаются гораздо легче, чем длинный горизонтальный набор инструкций.

Смысл оператора «вопросительный знак» ? – вернуть то или иное значение, в зависимости от условия. Пожалуйста, используйте его именно для этого. Когда вам нужно выполнить разные ветви кода – используйте if .

Задачи

if (строка с нулём)

Да, выведется.

Любая строка, кроме пустой (а строка "0" – не пустая), в логическом контексте становится true .

Можно запустить и проверить:

Название JavaScript

Используя конструкцию if..else , напишите код, который будет спрашивать: „Какое «официальное» название JavaScript?“

Если пользователь вводит «ECMAScript», то показать: «Верно!», в противном случае – отобразить: «Не знаете? ECMAScript!»

Источник

Условный оператор if. else в JS

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

Например, в программе для учителя может быть 4 возможных блока кода, которые соответствуют выставлению оценок 5, 4, 3 и 2. Чтобы принять решение, какой блок выбрать, то есть какую оценку поставить, программе нужны данные: например, процент выполнения теста.

Для принятия решений в программировании используют операторы сравнения и логические операторы. А для организации условных ветвлений, то есть выбора определенного блока кода, — условный оператор if. else.

В JavaScript есть три формы оператора if. else:

Оператор if в JavaScript

Давайте сначала договоримся, что инструкции — это команда или набор команд. То есть инструкции — просто кусок кода.

Cинтаксис

Как это работает

1. Оператор if оценивает условие внутри круглых скобок () .
2. Если условие — true, выполняются инструкции в теле if.
3. Если условие — false, инструкции в теле if игнорируются.

Примечание. Тело оператора if — код внутри фигурных скобок <> после if.

Пример

// проверяем, положительное ли число введено const number = prompt("Введите число "); // условие: число больше нуля? if (number > 0) < // инструкция в теле оператора if console.log("Число положительное."); >// инструкция после if console.log("Условные конструкции — это несложно.");

Предположим, пользователь ввел 2. В этом случае условие number > 0 равно true, потому что 2 > 0. Значит, код внутри тела if выполняется (см. рисунок выше).

Введите число: 2
Число положительное.
Условные конструкции — это несложно.

Теперь предположим, пользователь ввел -1. В этом случае условие number > 0 равно false. Следовательно, тело оператора if пропускается, выполняется код после оператора (см. рисунок выше).

Введите число: -1
Условные конструкции — это несложно.

Поскольку инструкция console.log("Условные конструкции — это несложно."); находится вне тела оператора if, она выполняется всегда, вне зависимости от условия if.

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

У оператора if есть необязательный пункт — else.

Синтаксис

if (условие) // инструкции1 в теле if
else // инструкции в теле else
>

Как это работает

1. Оператор if. else оценивает условие внутри скобок.

2. Если условие — true,
• выполняются инструкции1 в теле if;
• инструкции в теле else игнорируются.

3. Если условие — false,
• инструкции в теле if игнорируются;
• выполняются инструкции2 в теле else.

Пример

// определяет, какое введёно число: // положительное, отрицательное или ноль const number = prompt("Введите число: "); // проверяем, положительное число или нет if (number > 0) < // инструкция в теле if console.log("Это положительное число."); >// в противном случае — число отрицательно или ноль else < // инструкция в теле else console.log("Это отрицательное число или ноль."); >// инструкция после конструкции if. else console.log("Конструкция if. else — это несложно.");

Введите число: 2
Это положительное число.
Конструкция if. else — это несложно.

Предположим, пользователь ввел 2. В этом случае условие (number > 0) — true . Значит, инструкции в теле if выполнятся, а инструкции в теле else — проигнорируются.

Введите число: -1
Это отрицательное число или ноль.
Конструкция if. else — это несложно.

Теперь предположим, что пользователь ввел 2. В этом случае условие (number > 0) — false . Значит, инструкции в теле if игнорируются, а инструкции в теле else — выполняются.

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

Оператор if. else позволяет выбирать один из двух альтернативных блоков кода. Если нужно сделать выбор между тремя альтернативами, используют if. else if.

Синтаксис

if (условие1) // инструкции1 в теле if
else if (условие2) // инструкции2 в теле else if
> else // инструкции3 в теле else
>

Как это работает

1. Если условие1 — true , выполняются инструкции1 в теле if.

2. Если условие1 — false , оценивается условие2 .
• Если условие2 — true , выполняются инструкции2 в теле else if.
• Если условие2 — false, выполняются инструкции3 в теле else.

Пример

// определяет, какое число введено: // положительное, отрицательное или ноль const number = prompt("Введите число: "); // проверяем, положительное число или нет if (number > 0) < // инструкция1 в теле if console.log("Это положительное число."); >// раз число не положительное, проверяем, вдруг оно равно нулю else if (number == 0) < // инструкция2 в теле else if console.log("Это ноль."); >// раз число не положительное или не ноль, значит, это отрицательное число else < // инструкция3 в теле else console.log("Это отрицательное число."); >// инструкция после конструкции if. else if. else console.log("Конструкция if. else if. else — это несложно.");

Введите число: 0
Это ноль.
Конструкция if. else if. else. — это несложно.

Предположим, пользователь ввел 0. Тогда условие1 (number > 0) — false . Тогда проверяется условие2 (number == 0) . Условие2 — true , поэтому выполняется инструкция2 .

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

Один оператор if. else можно использовать внутри другого оператора if. else — и так сколько угодно раз. Такая конструкция называется вложенным оператором if. else.

Пример

// определяет, какое число введено: // положительное, отрицательное или ноль const number = prompt("Введите число: "); if (number >= 0) < if (number == 0) < console.log("Это ноль."); >else < console.log("Это положительное число."); >> else

Введите число: 5
Это положительное число.

Предположим, пользователь ввел 5. В этом случае условие (number >= 0) — true, поэтому управление программой передается во внешний оператор if. Далее оценивается услвоие внутреннего оператора if (number == 0) . Поскольку оно false, выполняется инструкция из тела else внутреннего оператора if.

Совет. Как вы видите, вложенные if. else усложняют логику программу. Поэтому стоит избегать вложенных конструкций, если это возможно.

Иногда <> можно не использовать

Если в теле if. else находится только одна инструкция, фигурные скобки можно не писать.

Два кода ниже работают одинаково:

const number = 2; if (number > 0) < console.log("Это положительное число."); >else

То же самое, но без скобок

const number = 2; if (number > 0) console.log("Это положительное число."); else console.log("Это отрицательное число или ноль.");

СodeСhick.io - простой и эффективный способ изучения программирования.

2023 © ООО "Алгоритмы и практика"

Источник