Функції.

Фронтенд розробка JavaScript. -> Функції.

Опції.

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

При цьому в ряді випадків у дії потрібно «підставити» нові дані, інколи ж і повністю повторити весь код.

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

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

Наприклад, діалогові вікна (alert, prompt і confirm) є типовими їх предста- вителями.

Інструкції функції «alert» малюють вікно та виводять у нього запам’ятоване під час виклику значення «х» (підставляють шаблон конкретні дані). Після чого чекають закриття вікна користувачем. Підпрограма закінчується, і інтерпретатор повертається до того місця, звідки стався її виклик. Цей процес називається повернення з функції (function return).

start page

При поверненні інтерпретатор також може запам’ятати деякі дані, які потрібно передати з функції у основну програму. Наприклад, коли нам був потрібен введення користувача, ми використовували інструкцію

x = prompt("Input x=")

Синтаксис оголошення функції

Функції користувача створюються за допомогою ключового слова “function”. Синтаксис оголошення функції має такий вигляд

function nameOfFunction(argument1, argument2){
    body
}

Розглянемо як приклад функцію, що створює 5 однотипних блоків-заголовків (

) з написами Header 1… Header 5.

<!doctype html>
<html>
    <head>
    </head>
    <body>
        <script>
            function show5Blocks() {
                for(i=1;i<=5;i++)
                document.write("<h2> Header "+i+
                "</h2>");
            }
            show5Blocks();
        </script>
    </body>
</html>

start page

Параметри функції

Передані з програми дані називаються «аргументами», а з боку функції ці дані приймаються як “параметри”.

Приготуємо новий файл.

<!doctype html>
<html>
    <head>
    </head>
    <body>
        <p id="Log"></p>
        <script>
        </script>
    </body>
</html>

В якому є один елемент з ідентифікатором Log.

Тепер визначимо функцію у розділі