Главная страница   /   4.3. Определение и использование функций (Pro jQuery

Pro jQuery

Pro jQuery

Адам Фриман

4.3. Определение и использование функций

Если вы разметили выражение прямо в элементе script, как я сделал в листинге 4-2, тогда браузер будет выполнять эти выражения сразу же, как только он достигнет их в загруженном документе. В качестве альтернативы, сразу несколько выражений можно поместить в функцию, которая не будет выполнена, пока браузер не достигнет того выражения, которое ее вызывает, как показано в листинге 4-3.

Листинг 4-3: Определение функции в JavaScript
<!DOCTYPE HTML>
<html>
<head>
	<title>Example</title>
	<script type="text/javascript">
		function myFunc() {
			console.log("This is a statement");
		};
		myFunc();
	</script>
</head>
<body>
	This is a simple example
</body>
</html>

Выражения, находящиеся в функции, заключены в фигурные скобки ({ and }) и называются блоком кода. В этом листинге определена функция myFunc, в блоке кода которой содержится единственное выражение. JavaScript – регистрозависимый язык, что означает, что термин function должен писаться с маленькой буквы. Выражение, находящееся в функции, не будет выполнено, пока браузер не достигнет другого выражения, которое вызывает функцию myFunc, вот такого:

myFunc();

Этот пример не особенно полезен, потому что функция вызывается сразу же после своего определения. Вы увидите примеры, где функции гораздо более полезны, когда мы будем работать с событиями в главе 9.

Определение функций с параметрами

Как и в большинстве языков программирования, в JavaScript можно определять функции с параметрами, как показано в листинге 4-4.

Листинг 4-4: Определение функций с параметрами
<!DOCTYPE HTML>
<html>
<head>
	<title>Example</title>
	<script type="text/javascript">
		function myFunc(name, weather) {
			console.log("Hello " + name + ".");
			console.log("It is " + weather + " today");
		};
		myFunc("Adam", "sunny");
	</script>
</head>
<body>
	This is a simple example
</body>
</html>

В этом листинге к функции myFunc я добавил два параметра. Они называются name и weather. JavaScript – это язык с динамической типизацией (слабой типизацией), что обозначает, что вам не нужно объявлять тип данных параметра при определении функции. Я еще вернусь к динамичной типизации в этой главе, когда мы будем рассматривать переменные JavaScript. Чтобы вызвать функцию с параметрами, при ее вызове нужно дать аргументам значения, например, так:

myFunc("Adam", "sunny");

Результат выполнения кода будет таким:

Hello Adam.

It is sunny today

Число аргументов при вызове функции не обязательно должно соответствовать числу параметров в функции. Если вы вызвали функцию с меньшим числом аргументов, нежели параметров, тогда значения тех параметров, для которых нет аргументов, будут неопределенны. Если вы вызываете функцию с большим числом аргументов, нежели параметров, то дополнительные аргументы будут просто проигнорированы.

Следствием этого является то, что вы не можете создать две функции с одинаковым именем и различными параметрами и ожидать, что JavaScript будет различать их, основываясь на аргументах, которые вы выставляете при вызове функции. Это называется полиморфизм, и хотя он поддерживается в таких языках как Java и C#, он недоступен в JavaScript. Вместо этого, если вы определите две функции с одинаковым именем, вторая функция заменит первую.

Определение функций, возвращающих результат

Можно вернуть результат функции, используя ключевое слово return. В листинге 4-5 показана функция, которая возвращает результат.

Листинг 4-5: Возвращение результата функции
<!DOCTYPE HTML>
<html>
<head>
	<title>Example</title>
	<script type="text/javascript">
		function myFunc(name) {
			return ("Hello " + name + ".");
		};
		console.log(myFunc("Adam"));
	</script>
</head>
<body>
	This is a simple example
</body>
</html>

Эта функция определяет один параметр и использует его, чтобы сгенерировать простой результат. Я вызвал функцию и отправил ее результат в качестве аргумента функции console.log:

console.log(myFunc("Adam"));

Обратите внимание, что вам не нужно объявлять, что функция будет возвращать результат, а также указывать тип данных результата. Результат выполнения данного кода будет следующим:

Hello Adam.