или не дойдет до закрывающей фигурной скобки (}) в конце функции. Как вы

узнаете из практикума «Реагирование на события JavaScript» далее в этой главе, вызывать функции JavaScript можно также с помощью обработчиков событий. При использовании для вызова функции обработчика события браузер будет продолжать загрузку и отображение Web-страницы, в то время как обработчик событий вызовет функцию и будет ожидать выполнения компьютером операто — ров функции.



Передача значений в функцию и из функции

Вызывая функцию JavaScript, вы можете передать в нее значения переменных, называемых параметрами {parameters). Список параметров функции находится между скобками, стоящими после имени функции в ее объявлении. Например,

следующий код объявляет функцию с двумя параметрами — Age (возраст) и

shoesize (размер обуви):



function сотриtelQ(Age, ShoeSize)

{

Age = Age * 2 ;

alert («Удвоенный возраст = » + Age + «; размер обуви = » + ShoeSize) ;

return (Age * ShowSize) / 2;

}

Чтобы передать значения функции computeiQO («вычислить коэффициент умственного развития»), включите в вызов функции параметры, как показано ниже:



IQ = computeIQ(Years01d, 10) ; *



Вызывая computeiQO, браузер передаст функции значение переменной

Yearsoid (сколько лет) в параметре Age и число 10 через параметр ShoeSize.

Короче говоря, браузер присваивает значения параметрам функции по позиции,

то есть первое значение в вызове функции присваивается первому параметру в объявлении, второе значение — второму параметру и т. д. Следовательно, если вы

присвоите Yearsoid значение 20 и затем вызовете computeiQO, функция выве —

дет На ЭКраН ОКНО сообщения СО Следующим текстом: «Удвоенный возраст =

40; размер обуви = Ю». В отличие от функций в предыдущих примерах, computeiQO возвращает значение вызывающему ее объекту. Чтобы возвратить значение из функции, вставьте значение, которое вы хотите отправить обратно, сразу же после ключевого слова retur n (см. последнюю перед закрывающей фи — гурной скобкой (}) строку в данном примере).

38 8 Глава 8. JavaScript



ЗарезервированныесловаJavaScript

Называя функцию или создавая переменные для хранения информации во время выполнения Web-браузером операторов в функции или сценарии, вы дол — жны выбирать имена функций и переменных такие, чтобы они не конфликтова —

ли с зарезервированными словами {reserved words) JavaScript, перечень которых можно найти в таблице 8.1. Слово function, например, идентифицирует начало объявления функции, равно как слово retur n дает браузеру указание вернуться в

ту точку, в которой он вызвал функцию. Если вы попытаетесь использовать в ка —

честве имен функций или переменных зарезервированные слова, Web-браузер, обнаружив ненадлежащим образом использованное слово, прекратит выполнение сценария или функции.



Пояснение выполняемой сценарием обработки с помощью комментариев

Создавая сценарии и функции, вы можете вставлять между операторами JavaScript примечания для пояснения обработки, которую должен выполнять браузер. Такие примечания программисты называют комментариями (comments). Вставка в код комментариев не только помогает другим разработчикам понять ваш сценарий, но также может помочь вам вспомнить, для чего в сценарии ис — пользованы те или иные операторы — особенно после того, как вы не заглядыва —

ли в сценарий в течение нескольких месяцев. Чтобы поместить в JavaScript-код комментарий, поставьте две левые косые черты (//) и наберите свое примечание, как показано ниже:



// Это комментарий



Обнаружив двойную косую черту, Web-браузер игнорирует весь остальной текст на данной строке. Помимо однострочных комментариев, которые начина —

ются с двойной косой черты (//), JavaScript поддерживает также блочные ком — ментарии, которые начинаются с косой черты и звездочки (/*) и заканчиваются звездочкой и косой чертой (*/), как показано ниже:



Таблица 8.1. Зарезервированные слова JavaScript



abstract Boolean break byte

case catch char class const continue default delete

do double



else extends false final

finally float for

function goto

if implements import

in instanceof



int interface long native

new null

package private protected public return short static super



switch synchronized this

throw throws transient true

try typeof var void while with

Глава 8. JavaScript 38 9





/*

Браузер будет игнорировать весь текст, обнаруженный им после косой

черты-звездочки, с которых начинается блок комментариев, до тех пор, пока не считает звездочку-косую черту, которые завершают

многострочный комментарий.

*/

Обнаружив блочный комментарий, браузер будет игнорировать весь текст, на — ходящийся между /* и */. Разработчики часто превращают в комментарий те или иные фрагменты кода, чтобы определить источник ошибок в обработке, вы —

полняемой сценарием. Предположим, например, что у вас есть Web-страница, в которой вы определили следующую функцию JavaScript:



function visitorSignln(Form)

{





if

(Form. fname. value == «»)

return false;

if

(Form. lname. value == «»)

return false;

if

(Form. email. value == «»)

return false;

f // Загрузить другую Web-страницу

self. location = «htdocs/Loggedln. htm»;

return;

}

Если функция visitorSignl n о по? акой-либо причине не может отобразить новую Web-страницу (Loggedln. htm), можно закомментировать три первых опе- ратора функции следующим образом:



function visitorSignln(Form)

{

/ *

if (Form. fname. value == «») return false;

if

в которой переменная используется. Приведенные ниже операторы определяют несколько различных переменных:



var BookTitle, ChapterNumber;

var Publisher;

var StringValue = «10″, IntValue *== 20;

var ConcatenatedValue = StringValue + IntValue; //результатом будет «1020″

var AdditionValue = StringValue + IntValue; // результатом будет 30



Следовательно, чтобы объявить переменные в сценарии, необходимо указать имя переменной (имена переменных) после ключевого слова var (как в первых двух строках). Если вы хотите присвоить переменной начальное значение, по- ставьте после имени переменной знак операции присваивания (=) и начальное значение (как в трех последних строках приведенного выше сценария). JavaScript накладывает следующие ограничения на объявления переменных:

• Имя переменной не может конфликтовать (то есть совпадать) с ключевым

словом JavaScript. В §

• Имена переменных должны начинаться с буквы либо символа подчеркива —

ния (_) и могут содержать цифры или буквы после первого символа.

• Имена переменных не могут включать в себя пробелы или знаки пунктуации.

Имена и ключевые слова JavaScript (как, например, var) чувствительны к ре — гистру, что значит, что var — ключевое слово, a var — нет. Аналогично,

stringvalu e И StringValue — Имена разных переменных.



Понятие операций JavaScript

Операции позволяют комбинировать переменные и/или литералы в выраже —

ния, дающие значения, которые затем можно выводить на экран, сохранять в пе —

ременных или использовать в других выражениях. Операции JavaScript можно сгруппировать в несколько классов, в зависимости от назначения операции. В таблице 8.2 приведены арифметические операции JavaScript, которые требуют двух переменных, значений или выражений (по одному с каждой стороны от знака опе — рации).



Таблица 8.2. Бинарные арифметические операции JavaScript

Операция Назначение Пример

Сложение Вычитание Умножение Деление Остаток

(возвращает

остаток деления)



выражение + выражение — выражение * выражение / выражение %



выражение выражение выражение выражение выражение

Глава 8. JavaScript 391





Хотя первые три операции в таблице 8.3 вы могли бы классифицировать как арифметические, они являются унарными операциями, поскольку эти операции выполняются только над одним выражением.





Когда вы помещаете двойной знак плюс (++) или двойной знак минус (—)

перед переменной (префиксная операция), действие выполняется перед присвое —

нием значения. И наоборот, если вы поместите знак операции инкремента или декремента после переменной (постфиксная операция), действие будет выполне — но после присвоения значения. Например:



i = 10;

j = i++; // j=10, i=l l

j = —i; / / j=9, i=9



Знак операции дополнения — то есть восклицательный знак (!) — возвращает значение, обратное логическому значению (true (истина) или fals e (ложь)) пе- ременной, оставляя значение переменной неизменным. Например:

TestResult = true;

document. write(TestResult); // true

document. write(!TestResult); / / false



Операции сравнения, как следует из их группового названия, позволяют срав — нивать одно выражение, переменную или литерал с другим. Обычно операции сравнения (приведенные в таблице 8.4) используются в условных операторах (та —

ких Как if И if-else ) И уПраВЛЯЮЩИХ ЦИКЛаХ (таКИХ Как while И for).





39 2 Глава 8. JavaScript





Знак условной операции (?:) — это специальный знак операции сравнения, применяемый только в операторах присваивания, где этот знак операции функ —

ционирует как оператор if-eise, с помощью которого принимается решение, какое из двух значений присвоить. Например, в приведенном ниже операторе, если выражение в скобках равно True (истинно), оператор присваивает перемен —

ной первое значение после вопросительного знака (?). И наоборот, -если выраже — ние равно False (ложно), оператор присваивает значение после двоеточия (:),

как показано ниже:* 11 1



PassingThisClass = (GPA>=2.0) ? «да» : «нет»;



Логические операторы позволяют сравнивать два логических (булевых) значе —

ния. Логические операторы, приведенные в таблице 8.5, обычно применяются для сравнивания результатов двух выражений сравнения в условном операторе или управляющем цикле.





Условная и повторяющаяся обработка

Сценарий — это перечень инструкций, которые Web-браузер выполняет для решения определенной задачи. Во всех простых сценариях, которые рассматри — вались до сих пор, Web-браузер начинает с первого оператора и выполняет каж — дый из операторов по порядку до конца сценария или функции. По мере услож- нения ваших сценариев у вас может возникнуть потребность в том, чтобы

браузер выполнял один набор операторов, если условие выполняется, и, возмож — но, второй набор операторов, если условие не выполняется. Иными словами, вам понадобится, чтобы браузер принимал решения и действовал в соответствии. Сценарии, принимающие решения, производят условную обработку. Иными сло — вами, в зависимости от результата одного или нескольких условий браузер будет выполнять те или иные операторы.

Чтобы принять решение, сценарий должен выполнить какого-либо рода про — верку. Например, один сценарий может проверять, правильный ли пароль ввел посетитель, а второй — верное ли количество цифр содержится в введенном по- сетителем номере телефона. Выполнять такую проверку сценарий будет с помо — щью операций сравнения, перечисленных в таблице 8.4. Операции сравнения

позволяют сценариям определить, как одно значение «сравнивается» с другим. Иными словами, с помощью операций сравнения сценарии могут проверять, равно ли одно значение другому, больше ли одно значение другого или меньше его. При использовании операторов отношения результатом сравнения будет либо tru e (истина), либо fals e (ложь) — в том смысле, что два значения либо удовлетворяют условию (true), либо нет (false). Практикум, озаглавленный «Принятие сценарием решений и выполнение соответствующей обработки», по —

Глава 8. JavaScript 39 3





кажет, как использовать три различные формы операторов if-then-eise, кото —

рые позволяют Web-браузеру решить, какие из операторов сценария выполнить, основываясь на результатах сравнений.

С принятием решений в сценариях тесно связана возможность повторения одного или нескольких операторов определенное число раз или до выполнения известного условия. В двух практикумах ниже будет показано, как использовать циклы for и while для повторения действий в сценариях и функциях. Оператор while дает возможность создать цикл, в котором браузер будет повторно выпол — нять набор операторов JavaScript, пока заданное условие остается истинным. В

то же время оператор for создает цикл, в котором браузер будет выполнять на — бор операторов фиксированное число раз или до появления предопределенного события (выполнения предопределенного условия).



Вставка функций JavaScript в HTML-код Web-страницы

Хотя функции JavaScript можно определять где угодно в HTML-коде страни- цы, вставляйте их в конце заголовочного раздела Web-страницы (то есть прямо перед дескриптором в начале страницы). Вставка функций JavaScript в заголовок Web-страницы гарантирует, что Web-браузер загрузит функции до того, как пользователь сможет инициировать событие, дающее браузеру указание вы- полнить какую-то из функций. Кроме того, помещая все функции в одно и то

же место вверху страницы, вы облегчите себе их поиск в случае, если вам пона — добится их модифицировать. (У Web-браузера не будет никаких проблем с на — хождением функций, которые ему необходимо выполнить, где бы они не находи — лись в рамках HTML-файла.)

IIpMMep JavaScript







document. write(«Это пример JavaScript-кода!»);

// —



IIoflflep3KKa JavaScript отсутствует… Извините!

браузер с поддержкой JavaScript (например, Netscape Navigator или Internet Explorer).

Интересно, что начальный и конечный дескрипторы альтернативного воспро — изведения документа со сценарием ( ) — это нефункцио —

нальные дескрипторы. Если браузер поддерживает сценарии, он распознает эти дескрипторы и игнорирует заключенную между ними информацию. Браузеры, которые не распознают дескриптор (то есть браузеры без поддержки сценариев), также не распознают начальный и конечный дескрипторы альтерна — тивного воспроизведения документа со сценарием () . В результате такие браузеры игнорируют эти дескрипторы и попросту отображают все, что находится между ними, как обычный текст Web-страницы.



Хранение множественных значений в одной переменной с помощью массивов JavaScript

Массив — это специальная переменная, содержащая множество значений од — ного и того же типа данных. Предположим, например, вы занимаетесь реализа- цией товаров пяти наименований, и вам нужно отслеживать количество и цену каждого наименования товара, имеющегося у вас в наличии. Вы могли бы со — здать пять переменных для хранения количества каждого из пяти наименований товара, и пять других переменных для хранения их цен, как показано ниже:



var ItemCountl, ItemCount2, ItemCount3, ItemCount4, ItemCount5;

var ItemPricel, ItemPrice2, Item]?rice3, ItemPrice4, ItemPrice5;

Глава 8. JavaScript 39 5





Теперь представьте себе, что ваш ассортимент насчитывает 100 наименований товаров. Вам придется потратить немало времени на объявление переменных и набор имен переменных в функциях, где потребуется обработать все товары сразу (например, подсчитать общую стоимость запасов).

ПРАКТИКУМ

К счастью, JavaScript предусматривает возможность создания одной переменной, могущей содержать в себе любое число значений — массива {array). Например, чтобы создать массивы, которые смогут содержать в себе количества и цену каж —

дого наименования товара из ассортимента в 100 наименований, вам понадобят-’

ся следующие операторы:



var ItemCount = new Array(100);

var ItemPrice • new Array (100) ;

Каждый из двух этих массивов, ItemCount и ItemPrice, содержит 100 участ —

ков памяти, называемых элементами, причем каждый элемент работает как пере — менная в том смысле, что каждый элемент может содержать в себе одно значе- ние. К каждому из элементов массива вы можете обратиться с помощью индекса

{index), используя следующий синтаксис: имя_массива [Индекс]. Поскольку от — счет элементов в массивах JavaScript начинается с нуля, первый элемент массива

имеет индекс 0. Следовательно, чтобы сохранить цену и количество товара 1, вам нужно будет написать что-то вроде



ItemCount[0] = 5;

ItemPrice[0] = 125.50;



Аналогично, количество и цену товара 100 вы бы сохранили в элементе мас — сива с индексом 99 с помощью следующих операторов:

ItemCount[99] = 10;

ItemPrice[99] = 89.95;



Принятие сценарием решений и выполнение соответствующей обработки

Оператор if позволяет сценариям произвести проверку и затем выполнять операторы, основываясь на результате проверки. Проверку оператор if обычно

выполняет с помощью операции сравнения JavaScript. Если результатом провер — ки является true, сценарий выполняет операторы, идущие после if. Если же ре —

зультат проверки — false, сценарий игнорирует (пропускает) следующий опера — тор. Формат оператора if выглядит следующим образом:



if (условие)

оператор;



ПРАКТИКУМ

Обратите внимание, что после if (условие), с которых начинается оператор

if, точка с запятой не ставится, поскольку оператор if продолжается на следую —

щей строке. В приведенном ниже сценарии определена функция checkieo, в которой оператор if используется для сравнения значения, хранящегося в пере —

39 6 Глава 8. JavaScript





менной Age (возраст), со значением 18. Если возраст больше или равен 18, сцена —

рий выдаст посетителю сообщение. В противном же случае, если значение меньше

18, сценарий просто возвращает управление оператору, вызвавшему функцию:



function checkl8()

{

var Age = 25;

i f (Age >= 18)

alert(«Пожалуйста, зарегистрируйтесь в списках избирателей на сайте

www. VoterRegistration. com»);

return;

}

При использовании в сценариях оператора if для условной обработки в не — которых случаях ваш сценарий должен будет выполнить только один оператор, если условие истинно; в других случаях сценарий должен будет выполнить не- сколько операторов. Когда сценарий выполняет только один оператор, следую — щий после if, этот оператор является простым: