Оператор Switch в Javascript

Создание условных выражений для решения, какое действие выполнять, - одна из самых фундаментальных частей программирования на JavaScript. Это руководство поможет вам научиться создавать несколько условных выражений с помощью ключевого слова switch.

Как операторы switch работают в JavaScript

Ключевое слово JavaScript switch используется для создания нескольких условных операторов, позволяющих выполнять разные блоки кода в зависимости от разных условий.

var score = 20;

switch(age){
    case 10:
        console.log("Score value is 10");
        break;
    case 20:
        console.log("Score value is 20");
        break;
    default:
        console.log("Score value is neither 10 or 20");
}

Приведенный выше код выведет на консоль «Score value is 20». Оператор switch работает, сравнивая данное ему выражение с выражениями в каждом предложении case.

Во-первых, вам нужно передать выражение в оператор switch, который затем заключен в пару круглых скобок (). Вы можете передать переменную или любое значение, как показано ниже:

var age = 29;

switch(age){}
// or
switch(true){}
switch("A string"){}
switch(5+5){}

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

В следующем примере оператор switch оценит значение переменной flower, а затем сравнит его с каждым предложением case, чтобы узнать, возвращает ли оно значение true:

• В первом случае будет сравниваться, если flower=== "rose"
• Второй случай будет сравниваться, если flower=== "violet"
• Третий случай будет сравнивать, если цветок === "sunflower"
• Когда все три предложения case возвращают false, будет выполнен вариант по умолчанию (блок default).

var flower = "tulip";

switch (flower){
    case "rose":
        console.log("Roses are red");
        break;
    case "violet":
        console.log("Violets are blue");
        break;
    case "sunflower":
        console.log("Sunflowers are yellow");
        break;
    default:
        console.log("Please select another flower");
}

Блок default  является необязательным, это означает, что вы можете просто выполнить оператор switch, не генерируя никаких выходных данных. 

Следующий код напечатает и «Roses are red», и «Please select another flower», потому что ключевое слово break опущено в предложениях case, в результате чего JavaScript продолжит сравнение выражений до последнего блока, как правило последний это блок default:

var flower = "rose";

switch (flower){
    case "rose":
        console.log("Roses are red");
    case "violet":
        console.log("Violets are blue");
    case "sunflower":
        console.log("Sunflowers are yellow");
    default:
        console.log("Please select another flower");
}

Даже если выражение «rose» уже нашло совпадение в первом предложении case, JavaScript все равно продолжит выполнение оператора switch, потому что ключевого слова break нет.

Примечание: в последнем случае нет необходимости использовать ключевое слово break, потому что к этому моменту оператор switch будет полностью выполнен.

Подводя итог, вот как работает оператор switch:

• Во-первых, вам нужно выражение, которое вы хотите сравнить с некоторыми условными выражениями.
• Затем вы пишете все условные выражения для сравнения с выражением в каждом предложении case, включая случай по умолчанию, когда нет подходящего выражения.
• Пишем код, который хотитим выполнить в каждом case блоке, с последующим ключевым словом break, чтобы JavaScript не сравнивал искомое выражение с предложениями остальными блоками case и default.

Теперь, когда вы знаете, как работает оператор switch, давайте узнаем, когда следует использовать оператор switch вместо оператора if..else.

Когда следует использовать оператор switch

И оператор switch, и оператор if..else используются для создания условных выражений. Эмпирическое правило состоит в том, что оператор switch используется только тогда, когда у вас есть точное значение для условных операторов.

var score = 70;

if(score > 50){
  console.log("Score is higher than 50");
} else {
  console.log("Score is 50 or lower");
}

Но вы не можете использовать score> 50 в качестве условия для предложения case. В следующем примере будет напечатан регистр по умолчанию, даже если score> 50:

var score = 70;

switch(score){
    case score > 50:
        console.log("Score is higher than 50");
        break;
    default:
        console.log("Score is 50 or lower");
}

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

var score = 70;

switch(true){
    case score > 50:
        console.log("Score is higher than 50");
        break;
    default:
        console.log("Score is 50 or lower");
}

Хотя приведенный выше код будет работать, в этом случае лучше использовать оператор if..else, потому что он более читабельный.