7.2. Організація розгалужених обчислювальних процесів
Для організації розгалужених обчислювальних процесів у мові JavaScript використовуються умовний оператор if і оператор switch.
Оператор if надає можливість реалізувати алгоритмічну конструкцію „розгалуження” у залежності від істинності деякої логічної умови. Загальна форма оператору if:
If (умова) {блок операторів 1}
else
{блок операторів 2}
Якщо логічна умова істинна, виконується блок операторів 1, у зворотному випадку буде виконано блок операторів 2. Можна використовувати скорочену форму оператору if:
if (умова) {блок операторів 1}
Коли у якості блоку операторів визначається лише один оператор, фігурні дужки можна не використовувати.
Розглянемо такий приклад застосування оператору if. Під час розчинення HTML – документа виводяться вікна діалогу, у яких можна ввести нараховану заробітну плату працівникові, а також відсоток виконання ним виробничого завдання. Сценарій використовує введені значення для розрахунку суми премії, виходячи з того, що премія нараховується у розмірі 2/% від заробітної плати, якщо завдання виконано на 100% ÷ 105%, якщо план виконано більше ніж на 105%, то премія становитиме 40% від заробітної плати. У випадку, коли план не виконано, премія не нараховується.
Можна створити такий HTML – документ:
<HTML>
<HEAD>
<TITLE>Приклад створення сценарію </TITLE> </HEAD>
<BODY> <FONT size=4>
<SCRIPT type="text/javascript">
var s = Number(prompt("Введіть суму заробітної плати: ",""));
var p = Number(prompt("Введіть відсоток виконання виробничого завдання",""));
var spr=0;
if (p<100) spr=0
else
if (p<=105) spr=s*0.2
else
spr=s*0.4;
document.write("Сума нарахованої заробітної плати: "+s+" грн."+"<br>");
document.write("Відсоток виконання виробничого завдання: "+p+"%"+"<br>");
document.write("Сума премії: "+spr+" грн.");
</SCRIPT>
</FONT>
</BODY>
</HTML>
У результаті виконання сценарію у вікні браузера документ може виглядати як на рис. 7.1.
Рисунок 7.1 - HTML – документ у вікні ІЕ після виконання сценарію із застосуванням оператору if
У прикладі використовується функція Number(), яка перетворює рядковий параметр на числове значення. У мові JavaScript існує і зворотна функція String(), що перетворює число на рядкове текстове значення.
Для організації розгалужених обчислювальних процесів може також використовуватися оператор switch (перемикач). Він дає змогу організувати розгалуження одразу по багатьох напрямках у залежності від фактичного значення деякої змінної або результату обчислення виразу. Загальна форма оператору:
switch (<змінна> / <вираз>)
{
case <значення 1>: {блок операторів 1};
case <значення 2>: {блок операторів 2};
. . . . . . . . . . .
case <значення N>: {блок операторів N};
default: {блок операторів}
}
Механізм дії оператору такий:
Крок 1. Якщо змінна або результат обчислення деякого виразу дорівнює значенню 1, то виконується блок операторів 1, а потім усі наступні оператори або до першого оператору break, який завершує виконання оператору switch.
Крок 2. Якщо змінна або результат обчислення деякого виразу дорівнює значенню 2, то виконується блок операторів 2, а далі всі наступні оператори або до першого оператору break.
. . . . . . . . . . . . . . .
Крок N. Якщо змінна або результат обчислення деякого виразу дорівнює значенню N, то виконується блок операторів N, потім оператор break або, якщо його немає, відбувається перехід на крок N+1.
Крок N+1. Виконується блок операторів, оператор switch завершує свою роботу.
Дію оператору switch можна розглянути на такому прикладі. На web – сторінці виводиться перелік навчальних курсів, у вікні діалогу користувачеві пропонується ввести номер певного курсу, у результаті виконання сценарію на сторінку виводиться вартість обраного курсу (рис. 7.2).
а)
в)
Рисунок 7.2 - Робота сценарію із використанням оператору switch
Код HTML – документа із вбудованим скриптом:
<HTML>
<HEAD>
<TITLE>Приклад створення сценарію </TITLE>
</HEAD>
<BODY> <FONT size=4>
Увага! <U>Вам пропонуються такі курси:</U>
<OL> <LI> Користувач ПК
<LI>Web - дизайн
<LI>Мова програмування Visual Basic.NET
<LI>Мова програмування C#
<LI>Мова HTML
<LI>Мова XML</OL>
<SCRIPT type="text/javascript">
var p= Number(prompt("Введіть номер курсу, який Вас цікавить",""));
switch (p)
{
case 1: document.write("Загальна вартість курсу №1 складає 900 грн."); break;
case 2: document.write("Загальна вартість курсу №2 складає 1350 грн."); break;
case 3: document.write("Загальна вартість курсу №3 складає 1400 грн."); break;
case 4: document.write("Загальна вартість курсу №4 складає 1570 грн."); break;
case 5: document.write("Загальна вартість курсу №5 складає 1100 грн."); break;
case 6: document.write("Загальна вартість курсу №6 складає 1200 грн."); break;
default: document.write("Ви не обрали жодний курс з тих, що пропонуються")
}
</SCRIPT>
</FONT>
</BODY>
</HTML>