console.log(i + " " + whatToDraw);
рисовать
}
};
Функция printMultipleTimes печатает строку, переданную
в аргументе whatToDraw столько раз, сколько указано в аргументе
howManyTimes. Второй аргумент сообщает функции, что печатать,
а первый — сколько раз это нужно печатать.
Вызывая функцию с несколькими аргументами, перечислите
нужные вам значения через запятую в скобках после имени функ-
ции. Например, чтобы напечатать кошачьи мордочки с помощью
функции printMultipleTimes, вызывайте ее так:
printMultipleTimes(5, "=^.^=");
0 =^.^=
1 =^.^=
130 Часть I. Основы
2 =^.^=
3 =^.^=
4 =^.^=
А чтобы четыре раза напечатать смайлик «^_^», вызывайте
printMultipleTimes так:
printMultipleTimes(4, "^_^");
0 ^_^
1 ^_^
2 ^_^
3 ^_^
Здесь при вызове printMultipleTimes мы указали значение 4 для
аргумента howManyTimes и строку «^_^» для аргумента whatToDraw.
В результате цикл выполнил четыре повтора (переменная i менялась
от 0 до 3), каждый раз печатая i + " " + "^ _ ^".
Чтобы дважды напечатать (>_<), введите:
printMultipleTimes(2, "(>_<)");
0 (>_<)
1 (>_<)
На этот раз мы передали число 2 для аргумента howManyTimes
и строку «(>_<)» для whatToDraw.
Возврат значения из функции
До сих пор все наши функции выводили текст в консоль с помощью
console.log. Это простой и удобный способ отображения данных,
однако мы не сможем потом взять это значение из консоли и использо-
вать его в коде. Вот если бы наша функция выдавала значение так, чтобы
его потом можно было использовать в других частях программы...
Как я уже говорил, функции могут возвращать значение. Вызвав
функцию, которая возвращает значение, мы можем затем использовать
это значение в своей программе (сохранив его в переменной, передав
в другую функцию или объединив с другими данными). Например,
следующий код прибавляет 5 к значению, которое возвращает вызов
Math.fl oor(1.2345):
5 + Math.floor(1.2345);
6
8. Функции 131
Math.fl oor — функция, которая берет передан-
ное ей число, округляет его вниз до ближайшего
целого значения и возвращает результат. Глядя
на вызов функции Math.fl oor(1.2345), представьте,
что вместо него в коде стоит значение, возвращае-
мое этой функцией, — в данном случае это число 1.
Теперь давайте создадим функцию, которая
Double — здесь
возвращает значение. Вот функция double, кото-
«удвоить»
рая принимает аргумент number и возвращает
произведение number * 2. Иными словами, зна-
чение, которое возвращает эта функция, вдвое
больше переданного ей аргумента.
Return —
var double = function (number) {
здесь «выход
return number * 2;
из функции»,
};
возвращение
Чтобы вернуть из функции значение, используйте оператор return,
после которого укажите само это значение. В строке мы воспользова-
лись return, вернув из функции double число number * 2.
Теперь можно вызывать нашу функцию double и удваивать числа:
double(3);
6
Возвращаемое значение (6) показано здесь второй строкой. Хоть
функции и способны принимать несколько аргументов, вернуть они
могут лишь одно значение. А если вы не укажете в теле функции, что
именно надо возвращать, она вернет undefi ned.
Вызов функции в качестве значения
Когда функция вызывается из кода программы, значение, возвращаемое этой
функцией, подставляется туда, где происходит вызов. Давайте воспользуемся
функцией double, чтобы удвоить пару чисел и затем сложить результаты:
double(5) + double(6);
22
Здесь мы дважды вызвали функцию double и сложили значения,
которые вернули эти два вызова. То же самое было бы, если бы вместо
вызова double(5) стояло число 10, а вместо double(6) — число 12.
132 Часть I. Основы
Также вызов функции можно указать в качестве аргумента другой
функции, при вызове которой в аргумент попадет значение, возвращен-
ное первой функцией. В следующем примере мы вызываем функцию
double, передавая ей в качестве аргумента вызов double с аргумен-
том 3. Вызов double(3) даст 6, так что double(double(3)) упрощается
до double(6), что, в свою очередь, упрощается до 12.
double(double(3));
12
Вот как JavaScript вычисляет это выражение:
double( double(3) );
double( 3 * 2 )
double(6)
6 * 2
12
Тело функции double возвращает number * 2, поэтому в точке
мы заменяем double(3) на 3 * 2. В точке мы заменяем 3 * 2 на 6.
Затем в точке мы делаем то же, заменяя double(6) на 6 * 2. И нако-
нец, в точке мы можем заменить 6 * 2 числом 12.
Упрощаем код с помощью функций
В третьей главе мы использовали методы Math.random и Math.fl oor,
чтобы выбирать случайные слова из массивов и генерировать драз-
нилки. В этом разделе мы перепишем генератор дразнилок, упростив его
с помощью функций.
Функция для выбора случайного слова
Вот как мы выбирали случайное слово из массива в третьей главе:
randomWords[Math.floor(Math.random() * randomWords.length)];
8. Функции 133
Если поместить этот код в функцию, можно многократно вызывать
его для получения случайного слова из массива — вместо того чтобы
вводить тот же код снова и снова. Например, давайте определим такую
Pick random
функцию pickRandomWord:
word —
выбрать
случайное
var pickRandomWord = function (words) {
слово
return words[Math.floor(Math.random() * words.length)];
};
Все, что мы сделали, — поместили прежний код в функцию. Теперь
можно создать массив randomWords.
var randomWords = ["Планета", "Червяк", "Цветок", "Компьютер"]; С помощью функции pickRandomWord мы можем получить случай-
ное слово из этого массива, вот так:
pickRandomWord(randomWords);
"Цветок"
При этом нашу функцию можно использовать с любым массивом.
Например, получить случайное имя из массива имен:
pickRandomWord(["Чарли", "Радж", "Николь", "Кейт", "Сэнди"]);
"Радж"
Генератор случайных дразнилок
Теперь давайте перепишем генератор дразнилок, используя нашу функ-
цию для выбора случайных слов. Для начала вспомним, как выглядел
код из третьей главы:
var randomBodyParts = ["глаз", "нос", "череп"];
var randomAdjectives = ["вонючая", "унылая", "дурацкая"];
var randomWords = ["муха", "выдра", "дубина", "мартышка", "крыса"];
// Выбор случайной части тела из массива randomBodyParts:
var randomBodyPart = randomBodyParts[Math.floor(Math.random() * 3)];
// Выбор случайного прилагательного из массива randomAdjectives:
var randomAdjective = randomAdjectives[Math.floor(Math.random() * 3)];
// Выбор случайного слова из массива randomWords:
var randomWord = randomWords[Math.floor(Math.random() * 5)];
134 Часть I. Основы
// Соединяем случайные строки в предложение:
var randomInsult = "У тебя " + randomBodyPart + " словно " +
randomAdjective + " " + randomWord + "!!!";
randomInsult;
"У тебя нос словно дурацкая выдра!!!"
Обратите внимание — конструкция words[Math.fl oor(Math.
random() * length)] повторяется здесь несколько раз. Воспользовав-
шись функцией pickRandomWord, можно переписать программу таким
образом:
var randomBodyParts = ["глаз", "нос", "череп"];
var randomAdjectives = ["вонючая", "унылая", "дурацкая"];
var randomWords = ["муха", "выдра", "дубина", "мартышка", "крыса"];
// Соединяем случайные строки в предложение:
var randomString = "У тебя " + pickRandomWord(randomBodyParts) +
" словно " + pickRandomWord(randomAdjectives) +
" " + pickRandomWord(randomWords) + "!!!";
randomString;
"У тебя нос словно дурацкая выдра!!!"
Этот код отличается от прежнего двумя моментами.
Во-первых, мы использовали функцию pickRandomWord
для выбора случайного слова из массива вместо того, чтобы
каждый раз писать words[Math.fl oor(Math.random() *
length)]. А во-вторых, вместо того чтобы сохранять каждое
случайное слово в переменной перед тем, как добавлять его
к итоговой строке, мы сразу объединяем возвращаемые
из функции значения, формируя таким образом строку.
Вызов функции можно рассматривать как значение, кото-
рое эта функция возвращает, поэтому все, что мы тут делаем, — это объ-
единяем строки. Как видите, новую версию программы гораздо легче
читать. Да и писать ее тоже было легче, поскольку часть повторяющегося
кода мы вынесли в функцию.
Делаем генератор дразнилок функцией
Можно еще усовершенствовать наш генератор случайных дразнилок,
сделав его функцией, которая возвращает дразнилки:
Generate ran-
var generateRandomInsult = function () {
dom insult —
var randomBodyParts = ["глаз", "нос", "череп"];
сгенерировать
var randomAdjectives = ["вонючая", "унылая", "дурацкая"];
случайную
var randomWords = ["муха", "выдра", "дубина", "мартышка", "крыса"]; дразнилку
8. Функции 135
// Соединяем случайные строки в предложение:
var randomString = "У тебя " + pickRandomWord(randomBodyParts) +
" словно " + pickRandomWord(randomAdjectives) +
" " + pickRandomWord(randomWords) + "!!!";
return randomString;
};
generateRandomInsult();
"У тебя череп словно унылая дубина!!!"
generateRandomInsult();
"У тебя нос словно дурацкая мартышка!!!"
generateRandomInsult();
"У тебя глаз словно вонючая муха!!!"