Умовні оператори Javascript - Конструкція IF-ELSE - Умови Javascript - Основы. Умовні оператори Приклади з if на javascript

💖 Подобається?Поділися з друзями посиланням

Умовний оператордозволяє пропустити або виконати певний блок коду в залежності від результату обчислення зазначеного виразу - умови. Можна сказати, що умовний оператор є точкою прийняття рішення у програмі, іноді його також називають оператор розгалуження. Якщо уявити, що програма - це дорога, а інтерпретатор PHP - мандрівник, що йде по ній, то умовні оператори можна уявити як перехрестя, де програмний код розгалужується на дві або дорожчі, і на таких перехрестях інтерпретатор повинен вибирати, якою дорогою рухатися далі .

Оператор if

Оператор if є найпростішим із операторів розгалужень.

Синтаксис оператора if:

Оператор if спочатку обчислює умовний вираз зазначений у круглих дужках, результатом цього виразу є булеве значення. Якщо отриманий результат є істинним, то інструкція виконується. Якщо вираз повертає помилкове значення (false), інструкція не виконується. Як умова може застосовуватися вираз будь-якої складності.

Якщо в тілі оператора if використовується лише одна інструкція, то укладати її у фігурні дужки можна, але не обов'язково. Однак, якщо потрібно виконати в тілі оператора якщо не одну інструкцію, а кілька, тоді ці кілька інструкцій необхідно укласти у фігурні дужки. Зверніть увагу на те, що після закриття фігурної дужки не слід ставити крапку з комою.

Наступний код демонструє застосування оператора if:

Оператори if можуть бути вкладеними в інші оператори if:

Зверніть увагу на останній приклад: інструкцію не обов'язково треба записувати саме під оператором if якщо інструкція не велика за розміром, то її можна записати і в один рядок.

Оператор if else

І так ми дізналися, що оператор if дозволяє виконувати інструкції у тому випадку, якщо умова є істинною. Якщо ж умова виявляється хибною, то ніяких дій не виконується. Однак часто буває необхідно виконати одні інструкції, якщо певна умова є істинною, та інші інструкції, якщо умова хибна. Саме для таких випадків використовується розгалуження if else. Воно складається з оператора if , за яким слідує блок інструкцій і ключового слова else , за яким слідує інший блок інструкцій.

Синтаксис оператора if else:

Оператор else не обов'язковий. Блок інструкцій, розташований після else, виконується за умовчанням, тобто. коли умовний вираз у if повертає значення false. Оператор else не може бути використаний окремо від оператора if. Блок else повинен розташовуватися тільки після оператора if його можна розглядати, як дія за умовчанням.

Змінивши наш попередній приклад, ми можемо побачити, як працює оператор if else , якщо умова повертає значення false:

Оператор if else може бути вкладеним. Такі вкладені умовні оператори зустрічаються практично досить часто. Оператор if є вкладеним, якщо він розташований усередині іншого блоку if або else. Якщо в коді використовується кілька операторів if підряд, то else завжди відноситься до найближчого if:

Останній else не відноситься до if($a) , тому що він знаходиться не у внутрішньому блоці, тому найближчий до нього виходить if($i) . Оператор else розташований всередині блоку відноситься до if ($ b), тому що цей if - є найближчим до нього.

Конструкція elseif/else if

Оператор if/else обчислює значення умовного виразу та виконує той чи інший фрагмент програмного коду. Але що, якщо потрібно виконати один із багатьох фрагментів? Якщо вам потрібно перевірити кілька умов поспіль, то для цього підійде конструкція elseif або else if (це одна і та ж конструкція просто по-різному записана). Формально вона не є самостійною конструкцією PHP - це лише поширений стиль програмування, що полягає у застосуванні операторів if/else, що повторюються. Вона дозволяє перевіряти додаткові умови, доки не буде знайдено дійсне або досягнуто блоку else . Конструкція elseif/else ifповинна розташовуватися після оператора if і перед оператором else, якщо такий є.

Тут перевіряється три умови, і, залежно від значення змінної $username, виконуються різні дії.

Насправді у цьому фрагменті немає нічого особливого. Це просто послідовність операторів if, де кожен оператор if є частиною конструкції else попереднього if. Для тих хто вперше зіткнувся з такою формою запису і йому не дуже зрозуміло, як це працює, ми перепишемо цей приклад, тільки в еквівалентній синтаксичній формі, що повністю показує вкладеність конструкцій:

У цьому прикладі ми спочатку оголошуємо чотири змінні за допомогою ключового слова var, і одразу присвоюємо їм числові значення. Далі за допомогою операторів інкременту та декременту ми змінюємо значення чисел. Інформація виводиться за допомогою функції Echo(дивіться статтю " "). Щоб не писати зайвий раз ім'я об'єкта, я використав конструкцію with().

Логічні оператори

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

  • && - Логічне "І"
  • || - "АБО"
  • ! - "НІ"
  • > - Л.О. більше П.О.
  • >= - Л.О. більше або дорівнює П.О.
  • < - Л.О. меньше П.О.
  • <= - Л.О. меньше или равен П.О.
  • == - Л.О. дорівнює П.О.
  • ! = - Л.О. не дорівнює П.О.
  • |= - Л.О. дорівнює собі АБО П.О.
  • &= - Л.О. дорівнює собі І П.О.
  • ^= - ВИКЛЮЧНЕ АБО

Тепер розглянемо наступний скрипт:

//***************************************** // логічні операції// logik_if_else.js //***************************************** var a = 10, b = 100, WshShell, title, msg1, msg2, msg3, msg4, vbInformation = 64; // Створюємо екземпляр класу WScript.Shell WshShell = WScript.CreateObject ("WScript.Shell"); title = "Робота з умовним оператором IF ELSE JS"; with(WshShell) ( if (a>= 5 && a<= 100 ) //истина msg1 = "TRUE" ; else msg1 = "FALSE" ; Popup (msg1, 5 , title, vbInformation) ; if (a>= 5 | b = = 100) // Істина msg2 = "TRUE"; else msg2 = "FALSE"; Popup (msg2, 5, title, vbInformation); //Умовний оператор js if else if (! a) // неправда msg3 = "TRUE" ; else msg3 = "FALSE" ; Popup (msg3, 5, title, vbInformation); if (a&= 100 ) //брехня msg4 = "TRUE" ; else msg4 = "FALSE" ; Popup (msg4, 5, title, vbInformation); )

Як і в попередньому скрипті, тут я використав конструкцію withскорочення програмного коду. Однак, для виведення інформації ми скористалися функцією Popup(дивіться статтю " "). В результаті діалогові вікна закриються автоматично через кілька секунд. Зверніть увагу, що в даному прикладі ми не використовували фігурні дужкив умовному операторі js if вони актуальні тільки тоді, коли потрібно виконати не один рядок коду, а кілька.

Насамкінець, давайте розглянемо такий практичний приклад, як розв'язання квадратного рівняння:

// Розв'язання квадратного рівняння// uravnenije_if_else.js // *********************************************************** var a, b, c, d, x, x1, x2; //Оголошуємо змінні a = - 2; b = 6; c = 20; //Іде пошук дискримінанта d = Math .pow (b, 2) - 4 * a * c; if (d== 0 ) ( x= b/ (2 * a) ; msg= "Рівняння має одне рішення, x рівно "+ x ) else ( if (d> 0 ) ( x1 = (- b + Math .sqrt (d) ) / (2 * a) ; x2 = (- b- Math .sqrt (d) ) / (2 * a) msg = "Рівняння має два рішення \n x1 рівно "+ x1 + " \n x2 рівно "+ x2; // умовний оператор if else js) else msg = " Рішення немає " ; ) WScript.Echo (msg);

Source для цього interactive example is stored in GitHub repository. Якщо ви знайдете, щоб розширити проектні приклади, повторити clone https://github.com/mdn/interactive-examples і виконати додаткові запити.

Syntax

if (condition) statement1 condition An expression that is considered to be either truthy or falsy . statement1 Statement that is executed if condition is truthy . Can be any statement, включаючи further nested if statements. Для execute multiple statements, use a block statement (( ... )) to group those statements. Для execute no statements, use an empty statement. statement2 Statement that is executed if condition is falsy and the else clause exists. Can be any statement, including block statements and further nested if statements.

Description

Multiple if...else statements не може бути створена для створення власної if clause. Примітка, що це не вказано (в одне слово) keyword in JavaScript.

If (condition1) statement1 else if (condition2) statement2 else if (condition3) statement3 ... else statementN

Для того, щоб сказати, що це робота, це є, що вона буде здатися, якщо незважаючи на це були належним чином indented:

If (condition1) statement1 else if (condition2) statement2 else if (condition3) ...

Для виконання множинних статей з власним ключем, використовуйте блок статей (( ... )) до групи тих статей. У загальному, це є хороша практика, щоб використати блоки статей, особливо в коді, що беруть участь у положенні:

If (condition) ( statements1 ) else ( statements2 )

Не підтримуйте примітивні Boolean values ​​true і false з truthiness або falsiness of the Boolean object. Будь-яке значення, що не є false , undefined , null , 0 , -0 , NaN , або empty string (""), і будь-який об'єкт, включаючи Boolean object whose value is false, є зрозумілим truthy when used as condition. For example:

Var b = New Boolean (false); if (b) // this condition is truthy

Examples

Using if...else

if (cipher_char === from_char) ( result = result + to_char; x++; ) else ( result = result + clear_char; )

Using else if

Зверніть увагу, що це не є syntax syn JavaScript в JavaScript. However, ви можете повідомити it with a space between else and if:

If (x > 50) ( /* do the right thing */ ) else if (x > 5) ( /* do the right thing */ ) else ( /* do the right thing */ )

Assignment within conditional expression

Це не залежить від використання прямих assignments в conditional expression, тому що assignment може бути confused with equality when glancing over code. Для прикладу, не можна використовувати наступний код:

If (x = y) ( /* do the right thing */ )

Якщо ви потрібні для використання assignment в conditional expression, як спільна практика is to put additional parentheses around the assignment. For example:

If ((x = y)) ( /* do the right thing */ )

Specifications

Specification Status Comment
ECMAScript Latest Draft (ECMA-262)
Draft
ECMAScript 2015 (6th Edition, ECMA-262)
Definition of "if statement" in that specification.
Standard
ECMAScript 5.1 (ECMA-262)
Definition of "if statement" in that specification.
Standard
ECMAScript 3rd Edition (ECMA-262)
Definition of "if statement" in that specification.
Standard
ECMAScript 1st Edition (ECMA-262)
Definition of "if statement" in that specification.
Standard Initial definition

Browser compatibility

Компактність таблиці на цій сторінці генерується з структурованих даних. Якщо ви знайдете, щоб дізнатися про ваші дані, клацніть на https://github.com/mdn/browser-compat-data і пишуть.

Update compatibility data on GitHub

DesktopMobileServer
ChromeEdgeFirefoxInternet Explorer OperaSafariAndroid webviewChrome для AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
if...elseChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 3Opera Full support YesSafari Full support YesWebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support 1.0nodejs Full support Yes

Починаємо вивчати тему умовних операторів у JavaScript. Тут ми будемо розглядати конструкцію If-Else. У перекладі російською ця умова читається як Коли-То.

Але перед тим як ми почнемо говорити про умови JavaScript, можна розглянути, як і де вони зустрічаються в реальному житті.

Наприклад, якщо увечері буде зрозуміло, то ми підемо у парк.

якщо цей автомобіль коштує менше 1000 $, то його куплю і т.п.

Таким чином, як Ви вже, напевно, зрозуміли умову «Якщо» і наслідок «То» часто зустрічаються в нашому житті. Тобто наша поведінка у різних ситуаціях в основному залежить від будь-яких умов.

Те саме стосується і мов програмування. Вони мають спеціальні конструкції, які дозволяють задавати певні умови і виконувати дії, якщо зазначені умови виконуються або не виконуються.

Давайте спробуємо реалізувати якийсь простий приклад застосування умовних операторів, а точніше конструкції If-Else в JavaScript.

Для початку розглянемо, як працює оператор If у JavaScript

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

Ми з родиною увечері йдемо до Парку

На що слід звернути увагу на прикладі вище?

По-перше, на знаки рівності == і присвоювання = JavaScript. Їх слід розрізняти: тобто спочатку ми створюємо змінну та присвоюємо їй значення. Потім за умови If ми говоримо вже про рівність.

По-друге, коли йдеться про виконання або невиконання умови, укладеного у фігурні дужки (), то слід розуміти, що мова JavaScript приймає умова чияк Істину, або як Брехня. Тобто якщо умова Істинно, як у нашому випадку, то виконується дія, укладена у фігурні дужки ().

Якщо ж умова неправильно , ​​як у прикладі нижче, то умова, укладена в фігурних дужках() , Виконуватися не буде.

Ось так працює умовний оператор If: якщо умова Істина – дія виконується, якщо Брехня – не виконуються. Все просто.

Тепер поговоримо про те, як працює конструкція If-Else у JavaScript. Else перекладається як «Інакше».

Давайте знову звернемося до реального життя. Найчастіше, якщо якась умова виконується, ми робимо одне. Якщо ж воно не виконується – «Інакше», то ми робимо інше.

Продовжимо працювати з прикладами, наведеними раніше.

Якщо увечері буде ясно, то ми підемо в парк, інакше (якщо буде похмуро)ми залишимося вдома і дивимось телевізор.

Або якщо цей автомобіль коштує менше 1000 $, то я його куплю, інакше (якщо він коштує дорожче) я на ці гроші вирушу в подорож.

JavaScript також має таку можливість - надавати альтернативу ( робити щось інше)якщо умова не виконується. У JavaScript ми можемо створювати подібні умови за допомогою конструкції If-Else. Давайте звернемося до прикладу.

Ми залишаємося вдома - дивитись телевізор

Розберемо наведений приклад.

Отже, якщо умова Істинно, то виконується дія, наступна після оператора If, укладена у фігурні дужки ().

Якщо ж умова Помилково, то виконується дія, наступна після оператора Else, також укладена у фігурні дужки ().

Ми розглянули, як працює проста, але конструкція If-Else, що часто використовується в JavaScript. І тут, на майбутнє, слід сказати про те, що хоч би якою складною не була умова, насамперед має значення те, що істинно воно чи хибно.

Для закріплення пройденого матеріалу « Умовні оператори Javascript - Конструкція IF-ELSEРозглянемо ще один приклад.

Тільки тепер використовуємо умову If-Else під час роботи з числами.

Змінна count менше або дорівнює 10

Тут, як і в попередніх прикладах, просто. У разі змінна count дорівнює 10 , тобто умова ІСТИНО і на екран виводиться відповідне повідомлення.

У прикладі нижче умова не виконується: змінна count більше 10, тобто умова ХИБНО, а значить, виводиться на екран повідомлення, що йде за оператором Else.

Змінна count більше 10

Отже, тут ми розглянули найпростіші приклади застосування умовних операторів JavaScript. Ось так - зовсім не складно, працює конструкція If-Else.

Візьміть масив друзів із попередньої теми: var friends = ["Олексій", "В'ячеслав", "Григорій", "Настя", "Павло"];

Напишіть умову, яку перевіряє : якщо кількість елементів у масиві більше або дорівнює 3, то виводиться повідомлення про те, що це великий масив, в якому щонайменше 3 елементи. А інакше, виведіть на екран повідомлення про те, що це невеликий масив, в якому не більше трьох елементів.

Перш ніж написати перевірну умову, необхідно пам'ятати і знати про те, як порахувати кількість елементів у Массіві. У цьому нам допоможе властивість length.

Це завдання можна було виконати трохи інакше, використовуючи більш короткий варіант написання коду. Змінну count, до якої заноситься кількість елементів масиву створювати необов'язково. Дивіться приклад нижче.



Натисніть на кнопку, щоб побачити, що робить цей сценарій:

Якби рядок alert("Ласкаво просимо!");була б написана не всередині функції, то вона виконувалася б щоразу, коли браузер доходив би до цього рядка. Але так як ми написали її всередині функції, цей рядок не виконується доти, доки ми не натиснемо кнопку.

Виклик функції (тобто звернення до неї) відбувається у цьому рядку:

Як ви бачите, ми помістили кнопку у форму та додали подію onClick="myfunction()"для кнопки.

У майбутніх уроках ми з вами розглянемо інші типи подій, які запускають функції.

Загальний синтаксис для наступних функцій:

Function functionname(змінна1, змінна2,..., зміннаN) (// Тут йде тіло функції, ті дії, які вона виконує)

Фігурні дужки: { і } позначають початок та закінчення функції.

Типовою помилкою при створенні функцій є неуважність та ігнорування важливості регістру символів. Слово functionмає бути саме function. варіант Functionабо FUNCTIONвикликає помилку.

Крім того, використання великих букв відіграє роль і при завданні імен змінних. Якщо у вас є функція з ім'ям myfunction(), то спроба звернутися до неї, як до Myfunction(), MYFUNCTION()або MyFunction()викликає помилку.

Сподобався матеріал і хочете віддячити?
Просто поділіться з друзями та колегами!


Дивіться також:



Розповісти друзям