Сложные сценарии

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

Сейчас вы познакомитесь с основными элементами JavaScript, которые используются практически в любом сценарии. Эта информация поможет вам быстрее изучить последующий материал, описывающий методы использования функций и операторов.

Использование функций

Сценарий, который мы создали выше представляет собой просто набор инструкций. При загрузке вэб-страницы браузер после дескриптора <SCRIPT> последовательно выполняет все инструкции сценария. Дойдя до дескриптора </SCRIPT> (или до ошибочной инструкции), браузер прекращает выполнение инструкций.

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

Выполнение задач с помощью функций

Вы уже познакомились с операторами JavaScript, часть которых отображается в скобках. Например:

document.write("Текст")

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

Функции имеют собственные параметры (вводятся в скобках), которые и определяют то, что они выполняют. Кроме того, функция часто возвращает значение в специально определенную в сценарии переменную. Например, приведенная ниже функция выводит на экран запрос на введение текста и сохраняет его в виде строковой переменной:

text = prompt("Введите любой текст");

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

Объекты

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

Каждый элемент данных, сохраненный в объекте, называется свойством. Например, для объекта пользователя Bill свойства определяются как Bill.address и Bill.phone.

Объеты также могут содержать и методы. Методы - это функции, которые обрабатывают свойства объекта. Например, объект нашего пользователя может содержать метод display(), отображающий на экране сведения о пользователе. В терминологии JavaScript оператор Bill.display() отображает сведения об объекте Bill.

Функция document.write, описанная ранее на самом деле представляет собой метод объекта document. Детально об объектах поговорим позже.

В JavaScript поддерживается три типа объектов:

  • Встроенные объеты. Эти объекты встроены непосредственно в JavaScript. Ранее вы уже познакомились с одним из таких объектов Date.
  • Объекты браузера. Эти объекты представляют элементы браузера и текущего документа HTML. Например, функция alert(), на самом деле представляет собой метод объекта window.
  • Пользовательские объекты. Это объекты, создаваемые программистом. Например вы можете создать пользовательский объект для каждого пользователя, который будет содержать контактную информацию о нем.

Обработка событий

Как я уже говорил ранее, не все сценарии в HTML определяются дескриптором <SCRIPT>. Сценарии также используются и как обработчики событий. Хотя этот термин и относится к языкам программирования высокого уровня, ничего сложного в нем нет. Обработчик события - это сценарий, который управляет событиями.

В реальной жизни все время происходят какие-то события. Например, в своем ежедневнике вы записываете: "Зайти к Юле" или "День рождения жены". Множество событий происходит неожиданно.

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

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

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

Обработчик событий связывается с определенным объектом браузера и определяется в дескрипторе объявления объекта, например текстовые и графические ссылки имеют событие onMouseOver, которое происходит при наведении указателя мыши на ссылку. Вот как выглядит дескриптор графической ссылки с обработчиком событий:

<IMG SRC="button1.gif" onMouseOver="highlight();">

Вы определяете обработчик событий как параметр дескриптора HTML и добавляете оператор JavaScript, управляющий событием, в кавычках. Идеально для управления событием использовать функцию, поскольку имена функций короткие и позволяют выполнять одновременно несколько операторов.

Условные операторы

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

Типичное условие отображается при задании оператора if:

if (a==1) alert("Значение счетчика 1");

Этот оператор позволяет сравнить значение переменной a с единицей. Если значение переменной равно 1, то на экран выводится предупреждение, введенное в кавычках. Обычно ни один сложный сценарий не обходится без условных операторов.

Циклы

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


i=1;
for (i==1; i<=10; i++) {
   alert("Это еще одно сообщение");
}
             

Оператор for - это основной оператор цикла. Циклы с таким оператором используются в JavaScript чаще всего. Естественно, в своих сценариях вы будете использовать циклы для выполнения более полезных задач.

Последовательность выполнения сценариев

Как я уже говорил, большой вэб-документ часто содержит несколько сценариев JavaScript. Например вверху страницы отображается дата, стоит скрипт службы ExitExchange, которая позволяет совершенно бесплатно увеличить посещаемость сайта в два раза и внизу висит счетчик посещений например SPYLOG. возникает справедливый вопрос, как браузер определяет очередность выполнения сценариев? чтобы не запутаться при добавлении на вэб-страницу сценариев JavaScript, следуйте приведенных ниже правил:

  • Дескриптор <SCRIPT>, введенный в элементе <HEAD> документа HTML всегда выполняется первым. Хотя этот сценарий и не позволяет отображать на экране данные, он прекрасно подходит для определения функций.
  • Сценарий, добавленный в тело документа HTML, выполняется всегда после сценариев, введенных в его заголовке. Несколько сценариев в теле документа HTML выполняются в порядке их следования.
  • Обработчики событий запускаются при выполнении соответствующих событий. Например, обработчик onLoad выполняется сразу после загрузки вэб-страницы. Чтобы правильно задать функцию, используемую в обработчике событий, старайтесь всегда определять ее в заголовке документа HTML.

nextn.bmp (246 bytes)

home.gif (161 bytes)

next.gif (900 bytes)

Сайт управляется системой uCoz