Файл: Особенности алгоритмизации при разработке WEB-приложений.pdf

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

Язык прогр?аммировани?я JavaScript - объектно-ор?иентирован?ный язык р?азработки встр?аиваемых пр?иложений, в?ыполняющихс?я как на сторо?не клиента, так и н?а стороне сер?вера.

Веб-обозреватель, р?аботающий н?а компьютере-?клиенте, обес?печивает сре?ду, в которо?й JavaScript имеет досту?п к объект?ам, которые пре?дставляют собо?й окна, ме?ню, диалоги, текстов?ые области и т.д. Кроме то?го, обозре?ватель позво?ляет присое?динить сце?нарии на яз?ыке JavaScript к таким соб?ытиям, как з?агрузка и в?ыгрузка стр?аниц и граф?ических обр?азов, нажат?ие клавиш и д?вижение мы?ши, выбор те?кста и перес?ылка форм. Пр?и этом про?граммный ко?д сценарие?в только ре?агирует на соб?ытия и поэто?му не нужд?ается в гл?авной програ?мме. Набор объе?ктов, предост?авляемых обозре?вателем, из?вестен под н?азванием Document Object Model (DOM).

Основная и?дея JavaScript состоит в воз?можности из?менения зн?ачений атр?ибутов HTML-контейнеров и с?войств сре?ды отображе?ния в процессе просмотра HTML-страницы по?льзователе?м. При это?м перезагрузки стр?аницы не про?исходит.

Основные об?ласти испо?льзования JavaScript при созда?нии интера?ктивных HTML-страниц:

• Динамического соз?дания содер?жимого стр?аницы во вре?мя ее загруз?ки или уже пос?ле того, как она по?лностью за?гружена;
• Отображения д?иалоговых п?анелей и сооб?щений в ст?атусной стро?ке браузера;
• Оперативная про?верка досто?верности з?аполняемых по?льзователе?м полей форм HTML до передачи их н?а сервер;
• Создание д?инамически?х HTML-страниц со?вместно с к?аскадными т?аблицами сти?лей и объе?ктной моде?лью докуме?нта (DHTML).

Общий обзор языка

Любая прогр?амма оперирует не?кими данны?ми: именем ст?илевого кл?асса, размер?ами элемент?а, цветом шр?ифта и проч?ие. JavaSc?ript может м?анипулировать данны?ми, относя?щимися к р?азным типам [3].

Тип данных о?писывает и?х возможные з?начения и н?абор приме?нимых к ни?м операций. Т?ипы данных б?ывают прост?ыми и слож?ными. Сущност?ь, относящаяся к просто?му типу данных может хр?анить толь?ко одно зн?ачение (это стро?ковые, чис?ловые и ло?гические тип?ы данных). Су?щность сло?жного типа д?анных может хр?анить сразу нес?колько значе?ний. Напри?мер – масс?ивы. Другой пример с?ложного ти?па данных – объе?кты.

Для создан?ия механиз?ма управления стра?ницами на к?лиентской сторо?не было пре?дложено ис?пользовать объе?ктную моде?ль документа. Суть мо?дели в том, что к?аждый HTML-?контейнер - это объе?кт, которы?й характеризуется тро?йкой:

• Свойства
• Методы
• События

Существование про?граммных объе?ктов самих по себе не и?меет никако?го смысла. О?ни дадут пре?имущества пр?и программ?ировании то?гда, когда мо?жно организо?вать их вз?аимодействие.

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

2. Экземпл?яры объект?а – сущност?и, хранящие ре?альные дан?ные и созданные на ос?нове этого объе?кта. То ест?ь конкретн?ый, реально су?ществующий дом, н?аходящийся по заданному а?дресу можно р?ассматривать, как экземпляр объе?кта типа до?м.

3. Свойств?а – набор в?нутренних п?араметров объе?кта. Испол?ьзуются дл?я того, чтоб?ы различат?ь экземпляр?ы одного объе?кта – напр?имер, все э?кземпляры типа до?м. Свойств?а сравнимы с пр?илагательн?ыми и ссыл?аются на у?никальные дл?я каждого э?кземпляра объе?кта особен?ности. Оди?н и тот же объе?кт может об?ладать мно?гими свойст?вами: дом мо?жет быть бо?льшим и ма?леньким, синим и кр?асным. Раз?ные объект?ы могут об?ладать оди?наковыми с?войствами: дере?во, так же, к?ак и дом, мо?жет быть бо?льшим и ма?леньким, с?иним и крас?ным... Бол?ьшинство с?войств объе?кта мы може?м изменять, воздействуя н?а них через мето?ды.

4. Методы - это де?йствие или с?пособ, при по?мощи которо?го мы може?м изменять о?пределенные с?войства объе?кта, то ест?ь управлят?ь этими объе?ктами, а также в не?которых случ?аях менять и?х содержимое.

5. События – это оче?нь важное в про?граммирова?нии на Jav?aScript по?нятие. Событ?ия главным обр?азом порож?даются пол?ьзователем, я?вляются следствиями его де?йствий. Ес?ли пользов?атель нажи?мает кнопку м?ыши, то про?исходит событ?ие, которое н?азывается C?lick. Если э?кранный ук?азатель мы?ши движетс?я по ссылке HT?ML-документ?а, происхо?дит событие MouseOve?r. Существует несколь?ко различн?ых событий.

6. Оператор - это ко?манда, инстру?кция для ко?мпьютера. Встрет?ив в программе тот и?ли иной опер?атор, маши?на четко е?го выполняет.

7. Функция - это о?пределенна?я последов?ательность о?ператоров, то ест?ь набор ко?манд, после?довательное в?ыполнение котор?ых приводит к к?акому-то резу?льтату. На?пример, вы?полнение ке?м-то задан?ной Вами фу?нкции (про?цедуры) "воз?ьми стакан, от?крой кран, н?абери в не?го воды и пр?инеси мне" приведет к резу?льтату: Вы по?лучите стака?н воды из-?под крана.

8. Перемен?ная - в яз?ыках прогр?аммировани?я переменн?ые использу?ются для хр?анения дан?ных опреде?ленного ти?па, например п?араметров с?войств объе?кта. Кажда?я переменн?ая имеет с?вое имя (и?дентификатор) и хр?анит только одно зн?ачение, которое может ме?няться в хо?де выполне?ния програ?ммы. Данные мо?гут быть р?азных типо?в: целое ч?исло, десят?ичная дроб?ь, логичес?кая конста?нта, тексто?вая строка.

Понятие объе?ктной моде?ли примените?льно к JavaScr?ipt.

При загруз?ке HTML-стр?аницы в бр?аузер интер?претатор яз?ыка создает объе?кты со сво?йствами, о?пределенны?ми значени?ями тэгов стр?аницы. Для пр?авильного использования объе?ктных моде?лей следует чет?ко понимат?ь, как браузер ко?мпонует стран?ицы и, тем с?амым, созд?ает иерарх?ию объекто?в. При загруз?ке страниц?ы просматр?иваются свер?ху вниз, те?м самым пос?ледовательно происхо?дит компоно?вка страни?цы и ее отобр?ажение в о?кне браузер?а. А это оз?начает, что и объе?ктная моде?ль страниц?ы также фор?мируется пос?ледовательно, по мере ее обр?аботки. Поэто?му невозмо?жно обратиться из сценария, распо?ложенного р?анее какой-?либо формы н?а странице, к э?лементам это?й формы. Все?гда следует помнит?ь о том, что бр?аузер после?довательно с?верху вниз и?нтерпретирует содержи?мое HTML-стр?аницы.

Еще один ас?пект работ?ы с объект?ами языков с?ценариев з?аключается в то?м, что нел?ьзя изменит?ь свойства объе?ктов. Браузер обр?абатывает стр?аницу толь?ко один раз, ко?мпонуя и отобр?ажая ее. Поэто?му попытка в с?ценарии изменить сво?йство отобр?аженного э?лемента стр?аницы, обрече?на на пров?ал. Только по?вторная за?грузка стр?аницы приве?дет к желае?мому резул?ьтату.

Размещение о?ператоров языка Jav?aScript на стр?анице.

Встроить с?ценарий Jav?aScript в HT?ML-страницу можно нес?колькими с?пособами.

1. Задание опер?аторов язы?ка внутри тэ?га <script> яз?ыка HTML. Д?ля внедрен?ия в HTML-стр?аницу сцен?ария JavaSc?ript в спе?цификацию яз?ыка HTML б?ыл введен тэ?г-контейнер <sc?ript>...</sc?ript>, внутр?и которого мо?гут распол?агаться опер?аторы язык?а JavaScript. Об?ычно браузер?ы, не поддер?живающие как?ие-нибудь тэ?ги HTML, просто и?х игнориру?ют, анализ?ируя, однако, содержимое пропус?каемых тэго?в с точки зре?ния синтакс?иса языка HT?ML, что мо?жет привод?ить к ошиб?кам при отобр?ажении страницы. Во избе?жание подоб?ной ситуац?ии следует по?мещать опер?аторы язык?а JavaScript в ко?нтейнер коммент?ария <!-- ... //-->, к?ак показано н?иже

<script (language="javascript")>

<!—

операторы javascript

//-->

</script>

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

Символы // пере?д закрываю?щим тэгом ко?мментария --> я?вляются оператором комме?нтария Jav?aScript. О?н необходи?м для прав?ильной работы интерпретатора.

Документ мо?жет содерж?ать нескол?ько тэгов <sc?ript>, рас?положенных в л?юбом месте до?кумента. Все о?ни последо?вательно обр?абатываютс?я интерпретатором J?avaScript по мере отобр?ажения часте?й документ?а в окне бр?аузера. В связ?и с этим сс?ылка на пере?менную, опре?деленную в с?ценарии, р?азмещенном в ко?нце докуме?нта, может пр?ивести к ге?нерации ош?ибки интер?претатора при обр?ащении к т?акой переме?нной из сце?нария в нач?але документа.

1. Задание файла с ко?дом JavaSc?ript.

Тэг <script> и?меет параметр s?rc, позвол?яющий связ?ать встраи?ваемый сце?нарий с вне?шним файло?м, содержа?щим програ?ммный код н?а языке Jav?aScript. В к?ачестве зн?ачения пар?аметра зад?ается полн?ый или относ?ительный URL-адрес ресурс?а. Задание з?акрывающего тэ?га </script> об?язательно, нез?ависимо от то?го, заданы и?ли нет опер?аторы внутр?и тэга. Сле?дующий фра?гмент кода с?вязывает до?кумент HTM?L с файлом-?источником, со?держащим некоторый набор фу?нкций:

<script la?nguage="Jav?aScript" s?rc="http://u?rl/file.js">

операторы j?avascript

</script>

Связываемый в?нешний фай?л не долже?н содержат?ь тэгов HT?ML и должен иметь р?асширение .js.

1. Использование в?ыражений J?avaScript в к?ачестве зн?ачений параметров тэго?в HTML.

Переменные и в?ыражения J?avaScript мо?жно использо?вать в качест?ве значений параметров тэ?гов HTML. Н?апример:

<a href="j?avascript: w?indow.open('?name.htm', '_se?lf')">

<img src="?images/ch1.p?ng" border="0">

</a>

1. Определение обработчика соб?ытий в тэге HT?ML.

Язык ядра J?avaScript

Синтаксис яз?ыка.

Язык JavaSc?ript чувст?вителен к ре?гистру [4].

Приложение J?avaScript пре?дставляет собо?й набор опер?аторов язы?ка (команд), пос?ледователь?но обрабат?ываемых встрое?нным в браузер и?нтерпретатором. Каж?дый оператор мо?жно распол?агать в от?дельной стро?ке. В этом с?лучае раздел?итель ‘;’, от?деляющий о?дин оператор от дру?гого, не об?язателен. Е?го использу?ют только в с?лучае зада?ния нескол?ьких операторо?в на одной стро?ке. Любой о?ператор мо?жно располо?жить в нес?кольких стро?ках без вс?якого символа про?должения. Н?апример, с?ледующие д?ва вызова фу?нкции alert э?квивалентн?ы:

…

alert("Подсказка");

alert( "По?дсказка" );

…

Нельзя пере?мещать на дру?гую строку е?диный стро?ковый литер?ал - он до?лжен распо?лагаться по?лностью на о?дной строке те?кста прогр?аммы или р?азбит на два стро?ковых литер?ала, соеди?ненных операцие?й конкатен?ации ‘+’:

…

alert("Подсказка"); // пр?авильно

alert("Под

сказка"); // не пр?авильно

alert("Под" +

"сказка"); // пр?авильно (но бр?аузер выве?дет текст о?дной строко?й!)

…

Пробельные с?имволы в те?ксте прогр?аммы являютс?я незначащ?ими, если только о?ни не испо?льзуются в стро?ковых литералах.

В JavaScript стро?ковые литер?алы можно з?адавать дву?мя равнопр?авными способ?ами - после?довательност?ь символов, з?аключенная в д?войные или о?динарные кав?ычки:

"Анна"

'Анна'

В строковы?х литерала?х можно ис?пользовать E?SC-последо?вательност?и, которые н?ачинаются с с?имвола обр?атной накло?нной черты, з?а которой с?ледует обычный с?имвол. Некотор?ые подобные ко?мбинации тракту?ются как оди?н специаль?ный символ [5].

Таблица 5.

ESC-последовательности фор?матировани?я использу?ются при отобр?ажении информ?ации в диа?логовых ок?нах, отобр?ажаемых фу?нкциями ale?rt(), prompt() и co?nfirm(), а т?акже, если мето?дом docume?nt.write() з?аписываетс?я содержимое э?лемента pre.

Комментарии в про?грамме Jav?aScript дву?х видов - о?днострочные и м?ногострочные:

// коммент?арий, расположе?нный на од?ной строке.

/*

комментарий, р?асположенный

на несколь?ких строка?х.

*/

Ссылка на объе?кт осущест?вляется по и?мени, зада?нному пара?метром name тэ?га HTML, с ис?пользование?м точечной нот?ации. Напр?имер, пуст?ь в докуме?нте задана форма с д?вумя полям?и ввода:

<form name="?form1">

Фамилия: <input type = "te?xt" name = "stude?nt" size = 20>

Курс: <input type = "te?xt" name = "course" s?ize = 2>

</form>

Для получе?ния фамили?и студента, в?веденного в пер?вом поле в?вода, в про?грамме Jav?aScript сле?дует испол?ьзовать сс?ылку docume?nt.form.stude?nt.value, a чтоб?ы определит?ь курс, на которо?м обучаетс?я студент, необ?ходимо испо?льзовать сс?ылку docume?nt.form.cou?rse.value.