JavaScript с нуля
- Автор: Кирупа Чиннатамби
- Жанр: Образование
- Дата выхода: 2021
- Цикл: Библиотека программиста
Читать книгу "JavaScript с нуля"
Простая функция
Лучший способ понять функции — это погрузиться в них и начать использовать. Поэтому создадим для начала самую простую функцию. Это не особо увлекательный процесс. Требуется лишь понимание некоторых особенностей синтаксиса вроде использования причудливых фигурных скобок и их собратьев.
Ниже приведен пример того, как выглядит простая функция:
function sayHello() {
alert("hello!");
}
Однако простого определения функции еще недостаточно, ее нужно также вызвать путем добавления следующих строк в конце:
function sayHello() {
alert("hello!");
}
sayHello();
Чтобы попрактиковаться, создайте новый HTML-документ (назовите его functions_sayhello.htm):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Say Hello!</title>
<style>
</style>
</head>
<body>
<script>
function sayHello() {
alert("hello!");
}
sayHello();
</script>
</body>
</html>
Если вы наберете этот текст полностью и просмотрите страницу в браузере, то увидите, как отобразится hello!. Это нужно сделать, чтобы убедиться, что наш код работает. Далее разберем, почему этот код сработал, а для этого разобьем функцию sayHello на несколько самостоятельных фрагментов и рассмотрим каждый из них подробнее.
Во-первых, мы видим ключевое слово function (рис. 3.3).
function sayHello() {
alert("hello!");
}
Рис. 3.3. Ключевое слово function
Это ключевое слово сообщает движку JavaScript, который живет в глубинах вашего браузера, что весь этот блок кода нужно рассматривать как связанный с функциями.
После ключевого слова function мы указываем актуальное имя функции и ставим после него открывающую и закрывающую скобки (), как показано на рис. 3.4.
function sayHello() {
alert("hello!");
}
Рис. 3.4. Имя функции и скобки
Завершая процесс объявления функции, нужно поставить открывающую и закрывающую фигурные скобки, внутри которых указываются нужные инструкции (рис. 3.5).
function sayHello() {
alert("hello!");
}
Рис. 3.5. Открывающая и закрывающая фигурные скобки
В заключение рассмотрим содержимое функции, а именно те инструкции, которые задают функциональность (рис. 3.6).
function sayHello() {
alert("hello!");
}
Рис. 3.6. Содержимое функции
В нашем примере содержимым является функция alert, отображающая диалоговое окно со словом hello!.
Последнее, что осталось рассмотреть, — это вызов функции (рис. 3.7).
function sayHello() {
alert("hello!");
}
sayHello();
Рис. 3.7. Вызов функции
Как правило, вызов функции — это имя той функции, которую мы хотим вызвать (как всегда, со скобками в конце). Без вызова функции она ничего не будет делать. Именно с вызовом наша функция просыпается и начинает что-то делать.
Вот мы и рассмотрели простейшую функцию. Далее, с опорой на только что пройденный материал, мы ознакомимся с более жизненными примерами функций.