JavaScript функції. Частина 3

18

Від автора: вітаю вас, друзі. У цій статті ми з вами продовжимо вивчення такої важливої теми, як користувальницькі функції JavaScript. Саме завдяки можливості створювати власні функції, ми можемо писати більш гнучкий і красивий код. У статті ми торкнемося теми повернення значення функцією.

Отже, в попередній статті ми написали функцію sum(), яка може приймати два параметра і виводити суму у вікні alert. А що якщо я не хочу виводити результат роботи функції, а хочу далі з ним працювати? Наприклад, зберегти у змінну. Зробити це допоможе команда return (англ. повернення, відповідь).

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

function sum(a, b){
return a + b;
}
sum(1, 2);
sum(10, 5);

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

alert(sum(1, 2));
alert(sum(10, 5));

Результат роботи нашої функції ми помістили всередину функції alert і домоглися того ж результату, що і в попередній статті. В чому ж зиск? А вигода в тому, що ми можемо, наприклад, зберегти результат роботи функції в змінну і працювати далі з цим результатом. Наприклад, спробуємо відняти один результат з іншого:

function sum(a, b){
return a + b;
}
var a = sum(1, 2),
b = sum(10, 5);
alert(a — b);

Результат роботи нашого коду: -12

Ну і, нарешті, давайте зробимо що-небудь складніше, наприклад нехай це буде функція, яка поверне нам випадаючий список років. Приблизно така функція у мене вийшла:

function getSelect(start, end){
var year = «;
while(start <= end){
year += » + start + «;
start++;
}
year += «;
return year;
}

Функція запускає цикл і складає в змінну year рік, який доступний на поточній ітерації циклу. Все це обов’язково конкатенируется в змінну, щоб ми не затирали попередній результат. Ну і в кінці ми повертаємо значення змінної year. Залишилося лише викликати функцію, передавши їй пару параметрів, і вивести результат її роботи на екран.

Виводити щось ми поки що можемо тільки в модальному вікні, тому давайте познайомимося з ще одним методом JavaScript — це метод document.write. Даний метод дозволяє надрукувати що-небудь в документі.

document.write(getSelect(1900, 2016));
document.write(getSelect(2000, 2016));

В результаті ми отримали два випадаючих списків. Перший: від 1900 до 2016 року, другий: від 2000 до 2016 року.

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

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