Условные конструкции позволяют выполнить те или иные действия в зависимости от определенных условий.
Конструкция if..else проверяет некоторое условие и если это условие верно, то выполняет некоторые действия. Простейшая форма конструкции if..else:
if(условие){
некоторые действия
}
После ключевого слова if в круглых скобках идет условие, а после условия - блок кода с некоторыми действиями. Если это условие истинно, то затем выполняются действия, которые помещены в блоке кода
Например:
const income = 100;
if(income > 50) {
console.log("доход больше 50");
}
Здесь в конструкции if используется следующее условие: income > 50. Если это условие возвращает true, то есть если константа income имеет значение больше 50,
то браузер отображает сообщение. Если же значение income меньше 50, то никакого сообщения не отображается.
Если блок кода содержит одну инструкцию, как в случае выше, то конструкцию можно упростить, убрав фигурные скобки и поместив действия сразу после условия:
const income = 100;
if(income > 50) console.log("доход больше 50");
или перенести действия на следующую строку
const income = 100;
if(income > 50)
console.log("доход больше 50");
Причем условия могут быть сложными:
const income = 100;
const age = 19;
if(income > 50 && age > 18){
console.log("доход больше 50");
console.log("возраст больше 18");
}
Конструкция if позволяет проверить наличие значения. Например:
let myVar = 89;
if(myVar){
console.log(`Переменная myVar имеет значение: ${myVar}`);
}
Если переменная myVar имеет значение, как в данном случае, то в условной конструкции она возвратит значение true.
Противоположный вариант:
let myVar;
if(myVar){
console.log(`Переменная myVar имеет значение: ${myVar}`);
}
Здесь переменная myVar не имеет значения. (В реальности она равна undefined) Поэтому условие в конструкии if возвратит
false, и действия в блоке конструкции if не будут выполняться.
Но нередко для проверки значения переменной используют альтернативный вариант - проверяют на значение undefined и null:
if (myVar !== undefined && myVar !== null) {
console.log(`Переменная myVar имеет значение: ${myVar}`);
}
Выше мы рассмотрели, как определить действия, которые выполняются, если условие после if истинно. Но что, если мы хотим также выполнять еще один набор инструкций, если условие ложно? В этом случае можно использовать блок else. Данный блок содержит инструкции, которые выполняются, если условие после if ложно, то есть равно false:
if(условие){
действия, если условие истинно
}
else{
действия, если условие ложно
}
То есть если условие после if истинно, выполняется блок if. Если условие ложно, выполняется блок else. Например:
const income = 45;
if(income > 50){
console.log("Доход больше 50");
}
else{
console.log("Доход меньше или равен 50");
}
Здесь константа income равна 45, поэтому условие после оператора if возвратит false,
и управление перейдет к блоку else.
Также если блок else содержит одну инструкцию, то можно сократить конструкцию:
const income = 45;
if(income > 50) console.log("Доход больше 50");
else console.log("Доход меньше или равен 50");
С помощью конструкции else if мы можем добавить альтернативное условие к блоку if. Например, выше в условие значение income может быть больше определенном значению может быть меньше, а может быть равно ему. Отразим это в коде:
const income = 50;
if(income > 50) {
console.log("Доход больше 50");
}
else if(income === 50){
console.log("Доход равен 50");
}
else{
console.log("Доход меньше 50");
}
В данном случае выполнится блок else if. При необходимости мы можем использовать несколько блоков else if с разными условиями:
const income = 500;
if(income < 200){
console.log("Доход ниже среднего");
}
else if(income>=200 && income<300){
console.log("Чуть ниже среднего");
}
else if(income>=300 && income<400){
console.log("Средний доход");
}
else{
console.log("Доход выше среднего");
}
При этом блок else применять необязательно:
const income = 500;
if(income < 200){
console.log("Доход ниже среднего");
}
else if(income>=200 && income<300){
console.log("Чуть ниже среднего");
}
else if(income>=300 && income<400){
console.log("Средний доход");
}
В javascript любая переменная может применяться в условных выражениях, но не любая переменная представляет тип boolean. И в этой связи возникает вопрос, что возвратит та или иная переменная - true или false? Много зависит от типа данных, который представляет переменная:
undefined
Возвращает false
null
Возвращает false
Boolean
Если константа/переменная равна false, то возвращается false.
Соответствено если константа/переменная равна true, то возвращается true
Number
Возвращает false, если число равно 0 или NaN (Not a Number), в остальных случаях возвращается true
Например, следующая переменная будет возращать false:
let x = NaN;
if(x){ // false
}
String
Возвращает false, если константа/переменная равна пустой строке, то есть ее длина равна 0, в остальных случаях возвращается true
const emptyText = ""; // false - так как пустая строка const someText = "javascript"; // true - строка не пустая
Object
Всегда возвращает true
const user = {name:"Tom"}; // true
const car = {}; // true
Конструкция switch..case является альтернативой использованию конструкции if..else и также позволяет обработать сразу
несколько условий:
const income = 200;
switch(income){
case 100 :
console.log("Доход равен 100");
break;
case 200 :
console.log("Доход равен 200");
break;
case 500 :
console.log("Доход равен 500");
break;
}
После ключевого слова switch в скобках идет сравниваемое выражение. Значение этого выражения последовательно сравнивается со значениями, помещенными после оператора сase. И если совпадение будет найдено, то будет выполняться определенный блок сase.
В конце каждого блока сase ставится оператор break, чтобы избежать выполнения других блоков. В данном случае константа income равна 200, поэтому будет выполняться блок
case 200 :
console.log("Доход равен 200");
break;
Оператор break служит для того, чтобы избежать выполнения других условий. Например, мы могли бы написать:
let income = 200;
switch(income){
case 100 :
console.log("Доход равен 100");
income +=100;
break;
case 200 :
console.log("Доход равен 200");
income +=100;
break;
case 500 :
console.log("Доход равен 500");
income +=100;
// break; // здесь смысла в break нет, так как последний блок
}
Здесь опять income равно 200 и опять будет выполняться блок
case 200 :
console.log("Доход равен 200");
income +=100;
break;
Благодаря оператору break после выполнения блока произойдет выход из конструкции switch, и никакие другие блоки case не будут выполняться.
Но теперь уберем оператор break:
let income = 200;
switch(income){
case 100 :
console.log("Доход равен 100");
income +=100;
case 200 :
console.log("Доход равен 200");
income +=100;
case 500 :
console.log("Доход равен 500");
income +=100;
}
console.log("Финальный доход равен", income);
Результат выполнения:
Доход равен 200 Доход равен 500 Финальный доход равен 400
Здесь изначально переменная income опять равна 200, соответственно будет выполняться блок
case 200 :
console.log("Доход равен 200");
income +=100;
Значение income увеличивается на 100, однако в конце блока нет оператора break, поэтому управление перейдет к проверке условия в следующий блок:
case 500 :
console.log("Доход равен 500");
income +=100;
И не важно, что income не равно 500 (а лишь 300 на данный момент), этот блок также будет выполняться.
Однако при необходимости можно сразу обработать несколько условий:
const income = 200;
switch(income){
case 100 :
case 200 :
console.log("Доход равен 100 или 200");
break;
case 500 :
console.log("Доход равен 500");
break;
}
В данном случае для условия, когда income равно 100 и 200, выполняются одни и те же действия.
Если мы хотим также обработать ситуацию, когда совпадения не будет найдено, то можно добавить необязательный блок default:
const income = 700;
switch(income){
case 100 :
console.log("Доход равен 100");
break;
case 200 :
console.log("Доход равен 200");
break;
case 500 :
console.log("Доход равен 500");
break;
default:
console.log("Доход неизвестной величины");
break;
}