Условни изрази в JavaСкрипт: if, else и else if
⚡ Умно обобщение
Условни оператори в JavaСкриптът решава кой блок код да се изпълни, като тества условие, а формулярите if, if…else и if…else if…else покриват почти всяко решение за разклоняване, от което един начинаещ скрипт някога ще се нуждае.
JavaСкриптови условни изрази
Има основно три вида условни изрази в JavaСценарий.
- if Изявление: Изявлението 'if' изпълнява код въз основа на условие.
- if... else Изявление: Инструкцията if…else се състои от два блока код; когато дадено условие е вярно, той изпълнява първия блок от код и когато условието е невярно, той изпълнява втория блок от код.
- if… else if… else Изявление: Когато трябва да се тестват множество условия и трябва да се изпълнят различни блокове код въз основа на това кое условие е вярно, се използва операторът if…else if…else.
Всяка от трите форми е разгледана по-долу със своя синтаксис и пример за изпълнение. Същите правила важат независимо дали скриптът е вътре в страницата или във външен файли дали условието е написано на най-горното ниво или вътре в функция.
Как да използваме условни оператори
Условните изрази се използват за определяне на потока на изпълнение въз основа на различни условия. Ако дадено условие е вярно, можете да извършите едно действие, а ако условието е невярно, можете да извършите друго действие.
Диаграмата по-долу показва тази идея като разклонение: едно условие се оценява веднъж и управлението се предава надолу по истинския или неверния клон, никога и по двата.
Ако изявление
Синтаксис:
if(condition) { lines of code to be executed if condition is true }
Можете да използвате if израз, ако искате да проверите само конкретно условие. Когато изразът в скобите се оцени на true, блокът се изпълнява; когато се оцени до false, интерпретаторът го пропуска директно и скриптът продължава със следващото изявление.
Опитайте това сами:
<html>
<head>
<title>IF Statments!!!</title>
<script type="text/javascript">
var age = prompt("Please enter your age");
if(age>=18)
document.write("You are an adult <br />");
if(age<18)
document.write("You are NOT an adult <br />");
</script>
</head>
<body>
</body>
</html>
В примера посетителя се пита за възраст, след което се проверява тази стойност два пъти: веднъж за 18 и повече години, веднъж за под 18 години. Тъй като два отделни if използват се твърдения, а не else, и двете условия се оценяват всеки път, когато страницата се зареди.
Съвременен еквивалент: Горният код е запазен точно както е публикуван. В текущия JavaСкрипт, със който обикновено се пише същата логика let or const вместо varс console.log() or textContent вместо document.write(), и без type="text/javascript" атрибут, който HTML5 прави незадължителен.
Ако…Иначе оператор
Синтаксис:
if(condition) { lines of code to be executed if the condition is true } else { lines of code to be executed if the condition is false }
Можете да използвате if...else оператор, ако трябва да проверите едно условие и да изпълните различен блок код за всеки резултат. Винаги се изпълнява точно един от двата блока, така че не е необходим отделен втори тест.
Опитайте това сами:
<html>
<head>
<title>If...Else Statments!!!</title>
<script type="text/javascript">
// Get the current hours
var hours = new Date().getHours();
if(hours<12)
document.write("Good Morning!!!<br />");
else
document.write("Good Afternoon!!!<br />");
</script>
</head>
<body>
</body>
</html>
Тук new Date().getHours() връща текущия час на часовника на браузъра като число от 0 до 23. Всяка стойност под 12 генерира сутрешния поздрав, а всяка друга стойност се предава на else клон.
Ако…Иначе Ако…Иначе оператор
Синтаксис:
if(condition1) { lines of code to be executed if condition1 is true } else if(condition2) { lines of code to be executed if condition2 is true } else { lines of code to be executed if condition1 is false and condition2 is false }
Можете да използвате if...else if...else оператор, ако искате да проверите повече от две условия. Условията се оценяват отгоре надолу, изпълнението спира на първото, което е истина, и последното else действа като универсален инструмент, когато никой от тях не съвпада.
Опитайте това сами:
<html>
<head>
<script type="text/javascript">
var one = prompt("Enter the first number");
var two = prompt("Enter the second number");
one = parseInt(one);
two = parseInt(two);
if (one == two)
document.write(one + " is equal to " + two + ".");
else if (one<two)
document.write(one + " is less than " + two + ".");
else
document.write(one + " is greater than " + two + ".");
</script>
</head>
<body>
</body>
</html>
Обърнете внимание на двете извиквания на parseInt()Стойности, върнати от prompt() са низове, така че сравняването им без преобразуване би сравнило текст, а не числа и би отчетоло „9“ като по-голямо от „10“.
Тройна Operator: Съкращение за if…else
Когато if...else блокът избира само между две стойности, условният (тернарен) оператор изразява същото решение като единичен израз. Той е единственият JavaСкриптов оператор, който приема три операнда: условие, въпросителен знак, стойността, използвана, когато условието е истинно, двоеточие и стойността, използвана, когато условието е невярно.
// if...else form let message; if (age >= 18) { message = "adult"; } else { message = "minor"; } // same decision as a ternary expression let label = age >= 18 ? "adult" : "minor";
Използвайте тернарния оператор, когато това подобрява четимостта, а не само за да спестите редове:
- Добро прилягане: избиране на една от две стойности за присвояване, връщане или пускане в шаблонен низ.
- Лошо прилягане: клонове, които изпълняват няколко оператора, извикват функции за страничните им ефекти или се нуждаят от собствени локални променливи.
- Избягвайте гнездене: троичен елемент вътре в троичен елемент е много по-труден за четене от
else ifверига.
switch оператор срещу if…else if…else
Дълго else if верига, която непрекъснато сравнява една и съща променлива с различни фиксирани стойности, обикновено е по-ясна като switch оператор. Функцията switch оценява израза си веднъж, след което преминава към съответстващия case; break спира изпълнението да се прехвърли в следващия случай и default играе ролята на финала else.
switch (day) { case "Sat": case "Sun": document.write("Weekend"); break; default: document.write("Weekday"); }
Двете структури не са взаимозаменяеми във всяка ситуация:
| Точка на сравнение | ако…иначе ако…иначе | превключите |
|---|---|---|
| Вид тест | Всеки булев израз, включително диапазони като hours<12 |
Равенство само срещу фиксирани ценности |
| Използвано сравнение | Какъвто и оператор да напишете | Строго сравнение, така че "5" не съвпада 5 |
| Четливост | Най-подходящ за няколко несвързани състояния | Най-добро за много стойности на една променлива |
| Често срещан бъг | Забравяйки за последното else |
Забравяне break, което позволява изпълнението да се провали |
Истински и фалшиви ценности в JavaУсловия на скрипта
Условието не е задължително да бъде сравнение. JavaСкриптът първо преобразува всичко, което намери в скобите, в булево число, поради което if (name) е валиден код. Само шест стойности се конвертират в невярно: false, 0, празният низ, null, undefined, и NaNВсичко останало е истина, включително низът "0", празен масив и празен обект.
Повечето условни грешки в скриптовете за начинаещи произлизат от кратък списък с грешки:
- Присвояване вместо сравнение:
if (x = 5)приписва и винаги е истинен;if (x === 5)сравнява. - Изненади, свързани с неравнопоставеността:
==преобразува типовете преди сравняване, така че"" == 0е вярно. Предпочитам===. - Липсващи брекети: без
{}само следващото единствено изречение принадлежи на клона, точно както в горните примери. - Неконвертиран вход: стойности от
prompt()и полетата на формуляра са низове, докатоparseInt()orNumber()ги преобразява. - Недостъпни клонове: в
else ifверига, поставете най-тясното условие първо, или по-широк по-ранен тест винаги ще спечели.

