Конструкция if-else.
В конце статьи размещено видео с темой данного урока.
Для чего нужна.
Данная конструкция создает механизм при котором выполняются условия. Допустим если на улице идет дождь то мы возьмем зонт, если дождя нет то возьмем солнечные очки.
Код такого условия будет выгладить так:
If (идет дождь) {
берем зонт;
} else {
Берем солнцезащитные очки;
}
Например так: если эта переменная меньше нуля, то вывести 'отрицательно', иначе (то есть если она больше нуля) вывести 'положительно'.
На языке JSстарой конструкции будет выглядеть так:
const a = 7;
if (a > 0) {
alert ('Верно!');
} else {
alert('Неверно!');
}
Когда несколько условий:
const year = 2019
if (year < 2015) {
alert ( 'Это слишком рано...' );
} else if (year > 2015) {
alert ( 'Это поздновато' );
} else {
alert ( 'Верно!' );
}
На языке JS новой конструкции будет выглядеть так:
let result = условие ? значение1 : значение2;
(a > 0)? alert ('Верно!') : alert('Неверно!')
Когда используется несколько значений:
(age< 3) ? alert( “Здравствуй, малыш!”) :
(age < 18) ? alert(“Привет!”) :
(age < 100) ? alert(“Здравствуйте!” ):
alert(“Какой необычный возраст!” );
Равенство по значению и типу
Для того, чтобы сравнить на равенство следует использовать оператор двойное равно ==, а не одиночное =, как можно было подумать.
if (a == 0){
alert('Верно!');
}else{
alert('Неверно!');
}
Оператор ’ ===‘ вместо ‘==‘
Кроме оператора == существует еще и оператор ===.
Сравнение с использованием ==
Перед сравнением оператор равенства приводит обе величины к общему типу. После приведений (одного или обоих операндов), конечное сравнение выполняется также как и для ===
var a = '0'; //переменная a представляет собой строку, а не число 0
if(a == 0) alert('Верно!') else alert('Неверно!');
//другой результат с оператором ===
if(a === 0) alert('Верно!') else alert('Неверно!');
Все операции сравнения
Работа с логическими переменными
Многие функции JavaScript в результате своей работы возвращают либо true (истина), либо false (ложь).
const a = true;
if (a == true){ //Если a равно true, то...
alert('Верно!');
} else {
alert('Неверно!');
}
или аналогичная запись
if (a) {
alert('Верно!');
} else {
alert('Неверно!');
}
Задачи на работу с if-else
1. Если переменная a равна нулю, то выведите 'Верно', иначе выведите 'Неверно'. Проверьте работу скрипта при a, равном 1, 0, -3.;
2. Если переменная a больше нуля, то выведите 'Верно', иначе выведите 'Неверно'. Проверьте работу скрипта при a, равном 1, 0, -3.;
3. Если переменная test равна true, то выведите 'Верно', иначе выведите 'Неверно'. Проверьте работу скрипта при test, равном true, false. Напишите два варианта скрипта - с короткой записью и с длинной.
4. Если переменная test не равна true, то выведите 'Верно', иначе выведите 'Неверно'. Проверьте работу скрипта при test, равном true, false. Напишите два варианта скрипта - с короткой записью и с длинной.
Логические операторы
В JavaScript есть три логических оператора:
- || (ИЛИ);
- && (И);
- ! (НЕ);
Несмотря на своё название, данные операторы могут применяться к значениям любых типов. Полученные результаты также могут иметь различный тип.
Оператор: || (ИЛИ)
Традиционно в программировании ИЛИ предназначено только для манипулирования булевыми значениями: в случае, если какой-либо из аргументов true, он вернёт true, в противоположной ситуации возвращается false.
Существует всего четыре возможные логические комбинации:
alert( true || true ); // true
alert( false || true ); // true
alert( true || false ); // true
alert( false || false ); // false
Если значение не логического типа, то оно к нему приводится в целях вычислений. Например, число 1 будет воспринято как true, а 0 – как false
ИЛИ «||» находит первое истинное значение
При выполнении ИЛИ || с несколькими значениями:
result = value1 || value2 || value3;
Оператор || выполняет следующие действия:
- Вычисляет операнды слева направо.
- Каждый операнд конвертирует в логическое значение. Если результат true, останавливается и возвращает исходное значение этого операнда.
- Если все операнды являются ложными (false), возвращает последний из них.
Оператор && (И)
В традиционном программировании && (И) возвращает true, если оба аргумента истинны, а иначе – false:
alert( true && true ); // true
alert( false && true ); // false
alert( true && false ); // false
alert( false && false ); // false
Пример с if:
const hour = 12;
const minute = 30;
if ( hour == 12 && minute == 30 ) {
alert( 'The time is 12:30' );
}
Как и в случае с ИЛИ, любое значение допускается в качестве операнда И:
if (1 && 0) { // вычисляется как true && false
alert( "won't work, because the result is falsy" );
}
И «&&» находит первое ложное значение
При нескольких подряд операторах &&
result = value1 && value2 && value3;
Оператор && выполняет следующие действия:
- Вычисляет операнды слева направо.
- Каждый операнд преобразует в логическое значение. Если результат false, останавливается и возвращает исходное значение этого операнда.
- Если все операнды были истинными, возвращается последний.
Другими словами, И возвращает первое ложное значение. Или последнее, если ничего не найдено.
Cхожи с поведением ИЛИ. Разница в том, что && возвращает первое ложное значение, а || – первое истинное.
Примеры на &&
Если первый операнд истинный, && возвращает второй:
alert( 1 && 0 ); // 0
alert( 1 && 5 ); // 5
Если первый операнд ложный, && возвращает его. Второй операнд игнорируется
alert( null && 5 ); // null
alert( 0 && "no matter what" ); // 0
Можно передать несколько значений подряд. В таком случае возвратится первое «ложное» значение, на котором остановились вычисления.
Приоритет оператора && больше, чем у ||
Приоритет оператора && больше, чем ||, так что он выполняется раньше.
Таким образом, код a &&b ||c &&d по существу такой же, как если бы выражения && были в круглых скобках: (a &&b) || (c &&d).
задача
Переменная min ровна числу от 0 до 59. Определите в какую четверть часа попадает это число (в первую, вторую, третью или четвертую).
const min = 10;
if ( min >= 0 && min <= 14 ) {
alert('В первую четверть.');
}
if (min >= 15 && min <= 30 ) {
alert('Во вторую четверть.');
}
if ( min >= 31 && min <= 45 ) {
alert('В третью четверть.');
}
if ( min >= 46 && min <= 59 ) {
alert('В четвертую четверть.');
}
Оператор ! (НЕ)
Оператор НЕ представлен восклицательным знаком !
Синтаксис довольно прост:
result = !value;
Оператор принимает один аргумент и выполняет следующие действия:
1. Сначала приводит аргумент к логическому типу true/false.
2. Затем возвращает противоположное значение.
Пример работы оператора !
alert( !true ); //вернет false
alert( !0 ); // вернет true
В частности, двойное НЕ используют для преобразования значений к логическому типу:
alert( !!"non-empty string" ); // true
alert( !!null ); // false
То есть первое НЕ преобразует значение в логическое значение и возвращает обратное, а второе НЕ снова инвертирует его. В конце мы имеем простое преобразование значения в логическое.
Приоритет НЕ !
Оператор ! является наивысшим из всех логических операторов, поэтому он всегда выполняется первым, перед && или ||.
Задачи
1. Если переменная a больше нуля и меньше 7-ти, то выведите 'Верно', иначе выведите 'Неверно'. Проверьте работу скрипта при a, равном 5, 0, -3, 2, 7.
2. Если переменная a равна нулю или равна пяти, то прибавьте к ней 7, иначе поделите ее на 10. Выведите новое значение переменной на экран. Проверьте работу скрипта при a, равном 5, 0, -3, 2.
Вложенные if
Предположим, нам необходимо спросить:
если переменная a не определена, то вывести 'Введите a', если определена, то проверить - больше нуля a или нет. Если больше нуля - то вывести 'Больше нуля!', если меньше - вывести 'Меньше нуля'.
Одной конструкцией if здесь не обойтись, нужно использовать две таким образом, чтобы одна была внутри другой.
Конструкция else if
Недостатком конструкции предыдущего примера является большое количество фигурных скобок.
Чтобы избавиться от них, можно пользоваться специальной конструкцией else if, которая представляет собой одновременно и else, и начало вложенного if.
Пример на следующем слайде.
если переменная a не определена, то вывести 'Введите a', если определена, то проверить - больше нуля a или нет. Если больше нуля - то вывести 'Больше нуля!', если меньше - вывести 'Меньше нуля'.
Конструкция switch-case
- Конструкция switch заменяет собой сразу несколько if.
- Она представляет собой более наглядный способ сравнить выражение сразу с несколькими вариантами.
- Конструкция switch имеет один или более блок case и необязательный блок default (по умолчанию).
Синтаксисs witch-case
1. Переменная x проверяется на строгое равенство первому значению value1, затем второму value2 и так далее.
2. Если соответствие установлено – switch начинает выполняться от соответствующей директивы case и далее, до ближайшего break (или до конца switch).
3. Если ни один case не совпал – выполняется (если есть) вариант default.
Пример решения задачи со witch-case
сайт поддерживает 3 языка:
- русский;
- английский;
- немецкий;
Переменная lang может принимать 3 значения:
- 'ru‘
- 'en‘
- 'de'
В зависимости от значения переменной lang следует вывести фразу на одном из языков.
Решение:
Задачи
- В переменной number могут быть числа: 10, 20, 30 или 40. Если она ровна '10', то в переменную res сохранить 'десять', если значение '20' – 'двадцать' и так далее. Задачу сделать через switch-case.
- Переменная day хранит в себе число из интервала от 1 до 31. Необходимо вывести в какой декаде месяца находится число (в первой, второй или третьей).
- Переменная month ровна числу из интервала от 1 до 12. Вывести время года в которой находится этот месяц (зима, лето, весна, осень).
- Переменная ровна '6789'. Проверьте, что последним символом строки будет цифра 6, 7 или 9. Если это так - выведите 'да', иначе выведите 'нет'.
- Дана строка из 3-х чисел. Найдите сумму этих чисел. Сложите числа первый символ строки, второй и третий.
- Дана строка из 8-ти чисел. Осуществите проверку на равенство суммы первых четырех чисел и суммы вторых четырех чисел. Если это так - выведите 'да', иначе выведите 'нет'.
Видео: