Відмінності між версіями «Підпрограми в JavaScript»
| Рядок 46: | Рядок 46: | ||
</font></code> | </font></code> | ||
| − | Всі команди скрипта, що знаходяться усередині фігурних дужок - () - належать функції myFunction (). Це означає, що обидві команди document.write () тепер зв'язані воєдино і можуть бути виконані при виклику зазначеної | + | Всі команди скрипта, що знаходяться усередині фігурних дужок - () - належать функції myFunction (). Це означає, що обидві команди document.write () тепер зв'язані воєдино і можуть бути виконані при виклику зазначеної функції. І дійсно, в нашому прикладі є три виклики цієї функції - можна побачити, що ми написали рядок myFunction () три рази відразу після того, як дали визначення самої функції. Тобто зробили три виклики. У свою чергу, це означає, що вміст цієї функції (команди, вказані в фігурних дужках) було виконано тричі. Оскільки це досить простий приклад використання функції, то у вас мігло виникнути питання, а чому, власне, ці функції настільки важливі в JavaScript. Після прочитання даного опису ви звичайно ж зрозумієте їх користь. Саме можливість передачі змінних при виконанні функції надає нашим скриптам справжню гнучкість - що це таке, ми побачимо пізніше. |
Функції можуть також використовуватися в спільно з процедурами обробки подій. Розглянемо наступний приклад: | Функції можуть також використовуватися в спільно з процедурами обробки подій. Розглянемо наступний приклад: | ||
Версія за 08:19, 21 травня 2010
Функції
У більшості наших програм на мові JavaScript ми будемо користуватися функціями. Тому вже тепер мені необхідно розповісти про це важливий елемент мови. У більшості випадків функції представляють собою лише спосіб зв'язати разом кількох команд. Давайте, наприклад, напишемо скрипт, що друкує якийсь текст три рази поспіль. Для початку розглянемо простий підхід:
<html> <script language="JavaScript">
document.write("Добро пожаловать на мою страницу!");
document.write("Это JavaScript!");
document.write("Добро пожаловать на мою страницу!");
document.write(Это JavaScript!");
document.write("Добро пожаловать на мою страницу!");
document.write("Это JavaScript!");< </script> </html>
І такий скрипт напише наступний текст
Ласкаво просимо на мою сторінку! Це JavaScript!
три рази. Якщо подивитися на вихідний код скрипта, то видно, що для отримання необхідного результату певна частина його коду була повторена три рази. Хіба це ефективно? Ні, ми можемо вирішити ту ж завдання ще краще. Як щодо такого скрипта для вирішення тієї ж самої задачі?:
<html>
<script language="JavaScript">
function myFunction() {
document.write("Добро пожаловать на мою страницу!");
document.write("Это JavaScript!");
}
myFunction();
myFunction();
myFunction();
</script>
</html>
У цьому скрипті ми визначили певну функцію, що складається з наступних рядків:
function myFunction()
nt.write("Добро пожаловать на мою страницу!");
document.write("Это JavaScript!"); }
Всі команди скрипта, що знаходяться усередині фігурних дужок - () - належать функції myFunction (). Це означає, що обидві команди document.write () тепер зв'язані воєдино і можуть бути виконані при виклику зазначеної функції. І дійсно, в нашому прикладі є три виклики цієї функції - можна побачити, що ми написали рядок myFunction () три рази відразу після того, як дали визначення самої функції. Тобто зробили три виклики. У свою чергу, це означає, що вміст цієї функції (команди, вказані в фігурних дужках) було виконано тричі. Оскільки це досить простий приклад використання функції, то у вас мігло виникнути питання, а чому, власне, ці функції настільки важливі в JavaScript. Після прочитання даного опису ви звичайно ж зрозумієте їх користь. Саме можливість передачі змінних при виконанні функції надає нашим скриптам справжню гнучкість - що це таке, ми побачимо пізніше.
Функції можуть також використовуватися в спільно з процедурами обробки подій. Розглянемо наступний приклад:
<html>
<head>
<script language="JavaScript">
function calculation() {
var x= 12;
var y= 5;
var result= x + y;
alert(result);
}
</script>
</head>
<body>
<form>
<input type="button" value="Calculate" onClick="calculation()">
</form>
</body>
</html>
Тут при натисненні на кнопку здійснюється виклик функції calculation (). Як можна помітити, ця функція виконує якісь обчислення, користуючись змінними x, y і result. Змінну ми можемо визначити за допомогою ключового слова var. Змінні можуть використовуватися для зберігання різних величин - чисел, рядків тексту і т.д. Так рядок скрипта var result = x + y; повідомляє браузеру про те, що необхідно створити змінну result і помістити туди результат виконання арифметичної операції x + y (тобто 5 + 12). Після цього в змінний result буде розміщено число 17. В даному випадку команда alert (result) виконує те ж саме, що й alert (17). Іншими словами, ми отримуємо випадає вікно, в якому написано число 17.
