МегаПредмет

ПОЗНАВАТЕЛЬНОЕ

Сила воли ведет к действию, а позитивные действия формируют позитивное отношение


Как определить диапазон голоса - ваш вокал


Игровые автоматы с быстрым выводом


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


Целительная привычка


Как самому избавиться от обидчивости


Противоречивые взгляды на качества, присущие мужчинам


Тренинг уверенности в себе


Вкуснейший "Салат из свеклы с чесноком"


Натюрморт и его изобразительные возможности


Применение, как принимать мумие? Мумие для волос, лица, при переломах, при кровотечении и т.д.


Как научиться брать на себя ответственность


Зачем нужны границы в отношениях с детьми?


Световозвращающие элементы на детской одежде


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


Как слышать голос Бога


Классификация ожирения по ИМТ (ВОЗ)


Глава 3. Завет мужчины с женщиной


Оси и плоскости тела человека


Оси и плоскости тела человека - Тело человека состоит из определенных топографических частей и участков, в которых расположены органы, мышцы, сосуды, нервы и т.д.


Отёска стен и прирубка косяков Отёска стен и прирубка косяков - Когда на доме не достаёт окон и дверей, красивое высокое крыльцо ещё только в воображении, приходится подниматься с улицы в дом по трапу.


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

Сценарии стороны клиента. Язык JavaScript





 

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

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

JavaScript, как и другие языки для встраивания сценариев в HTML-документы, имеет программный интерфейс для доступа навигатору. Навигатор, как правило, имеет панель инструментов, строку ввода адреса, рабочую область и строку состояния. Панель инструментов, как минимум, содержит кнопки "Back", "Forward", "Stop", "Reload" и "Home". Используя язык JavaScript, можно управлять содержимым рабочей области и строки состояния, а также открывать новые окна навигатора, возможно, без панели инструментов и строки ввода адреса. Кроме того, можно вызывать простейшие диалоговые панели с кнопками и полями ввода.

Для доступа к компонентам в языке JavaScript используются объекты. Под объектом понимается некоторая программная абстракция, в которой инкапсулированы свойства (данные) и методы (код) некоторого реального объекта. В языке JavaScript между объектами не устанавливается отношения наследования. Таким образом, JavaScript не является объектно-ориентированным языком.

С понятием объекта связано понятие класса. Каждый объект принадлежит определенному классу. Например, каждый объект "окно" принадлежит классу "окно" (window). Можно сказать, что каждое конкретное окно является переменной типа window или экземпляром класса window. С этой точки зрения, понятие класса близко к понятию типа.

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

С точки зрения лексики и синтаксиса, язык JavaScript похож на языки C++ и Java.

Рассмотрим следующие элементы языка JavaScript:

типы;

операции;

операторы;

встроенные функции;

объекты и классы.

Типы языка JavaScript, не соответствующие никаким классам, – числовой и логический, будем условно называть number и bool. Значения типа number – целые и вещественные числа. Значения типа bool соответствуют числовым значениям 0 и 1. Константы языка JavaScript могут быть числовыми и строковыми. Последние имеют тип, соответствующий классу string. Значения остальных типов (bool и других классов) не представляются в виде констант, но могут возвращаться функциями и методами. Следует еще раз отметить, что слов number и bool в JavaScript не существует. Это условное обозначение для указания типов свойств, параметров и возвращаемых значений функций и методов.



В JavaScript имеется ряд операций аналогичных операциям языка C: '+', '–', '*', '/', '%', '<<', '>>', '+=', '–='. Операция '+' для строк перегружена и означает конкатенацию.

Основные операторы JavaScript перечислены в табл. 5.

Таблица 5
Операторы языка JavaScript
Оператор Описание
var name = value Объявление переменной name и присвоение ей значения value
if (cond) {...} else {...} Оператор условия
while (cond) {...} Цикл с предусловием
for (init; cond; modif) {...} Цикл с параметром. Перед выполнением цикла осуществляется инициализация init. Перед каждой итерацией цикла проверяется условие cond. После каждой итерации производится модификация параметра цикла modif.
for (prop in obj) {...} Цикл свойств объекта obj
break Оператор прерывания цикла
continue Оператор продолжения цикла
function name(par) {...} Определение функции

 

Встроенные функции JavaScript перечислены в табл. 6.

Таблица 6
Встроенные функции JavaScript
Функция Описание
string escape(string) Перевод строки в escape-последовательность
string unescape(string) Перевод escape-последовательности в строку
number parseFloat(string value) Перевод строки в вещественное число
number parseInt( string value, [number radix] ) Перевод строки в целое число в заданной системе счисления
Bool isNaN(number) Проверка на "не число" (Not-a-Number). Не числом является, например, бесконечность, получающаяся при делении на 0.
string eval(string) Выполнить строку

 

Здесь и далее для объявления функций, свойств и методов применен C-подобный стиль: тип возвращаемого значения, идентификатор (название), список параметров в круглых скобках. Необязательные параметры перечислены в квадратных скобках. В качестве типа указывается имя класса или одно из слов number или bool.

Объекты JavaScript описывают интерфейс доступа к документу в навигаторе и инкапсулируют его свойства и методы.

В табл. 7 приведены свойства и методы основных классов JavaScript.

Таблица 7
Классы JavaScript
Свойства и методы Описание
string: Строка (с информацией о выводе на экран)
number length Длина строки
string big() Большой шрифт
string small() Маленький шрифт
string bold() Полужирный шрифт
string italics() Наклонный шрифт
string strike() Перечеркнутый
string fixed() Моноширинный шрифт
string sub() Нижний индекс
string sup() Верхний индекс
string blink() Мигающая строка
string toLowerCase() Строчные буквы
string toUpperCase() Заглавные буквы
string fontsize(number size) Установить размер символов
string fontcolor(string color) Установить цвет символов
string anchor(string name) Превращает строку в "якорь" name
string link(string href) Превращает строку в гиперссылку href
string charAt(number i) i-й символ строки
number indexOf(string what, [number from]) Позиция подстроки what, начиная с позиции from
number lastIndexOf(string what, [number from]) Позиция подстроки what при просмотре в обратном порядке, начиная с from
string substring(number begin, number end) Подстрока
window: Окно
string name Название окна
string defaultStatus Содержимое строки состояния по умолчанию
string status Строка состояния
number length Число фреймов в окне
frame[] frames Массив фреймов
Продолжение табл. 7
Свойства и методы Описание
window self Ссылка на себя
window window Ссылка на себя
window parent Родительское окно
window top Ссылка на верхнее окно в иерархии
document document Документ
frame frame Фрейм
location location Местоположение отображаемого содержимого
window open(string URL, string Name, string features) Открыть новое окно. Параметр features представляет собой список параметров и значений, перечисленных через запятую. Название параметра и значение разделяются символом "=". Возможны следующие параметры: toolbar, location, directories, status, menubar, scrollbars, resizeable, width, height. Все параметры, кроме width и height принимают логические значения (yes, no, 1 или 0). Параметры width и height принимают целочисленные значения.
close() Закрыть окно
timeout setTimeout(string expr, number msec) Установить таймаут
clearTimeout(timeout t) Удалить таймаут
alert(string message) Диалоговая панель с сообщением message и кнопкой Ok
bool confirm(string message) Диалоговая панель с сообщением message и кнопками Ok и Cancel
string prompt(string message, string default) Диалоговая панель с сообщением и полем ввода
frame: Фрейм
string name Название
number length Число внутренних фреймов
frame[] frames Набор фреймов внутри данного
frame self Ссылка на себя
frame window Ссылка на себя
frame parent Ссылка на родительский фрейм
window parent Ссылка на родительское окно
timeout setTimeout(string expr, number msec) Установить таймаут
clearTimeout (timeout t) Удалить таймаут
Продолжение табл. 7
Свойства и методы Описание
location: Идентификатор ресурса
string hash Поле fragment в URI
string host Поля host и port в URI
string hostname Поле host в URI
string href URI
string pathname Поле path в URI
number port Поле port в URI
string protocol Поле protocol в URI
string search Параметры в URI для программы CGI
document: Документ (содержимое окна)
string title Заголовок
string URL URI
Date lastModified Дата и время последней модификации документа
string fgColor Цвет переднего плана
string bgColor Цвет фона
string linkColor Цвет ссылки
string alinkColor Цвет ссылки во время перехода
string vlinkColor Цвет посещенной ранее ссылки
anchor anchor Якорь
link link Ссылка
history history Набор ссылок
form form Форма
anchor[] anchors Массив "якорей"
link[] links Массив ссылок
form[] forms Массив форм
string referrer URI документа, из которого вызван текущий
open([string mime]) Начать вывод содержимого документа
close() Завершить вывод содержимого документа
write(...) Вывести в качестве содержимого документа
writeln(...) Вывести в качестве содержимого документа и перевести строку
history: Набор ссылок
number length Число ссылок в памяти
back() Вернуться на предыдущую страницу
forward() Загрузить следующую страницу
go(number delta) Перейти
go(string location) Перейти
static Math: Математические константы и функции
number E E
Продолжение табл. 7
Свойства и методы Описание
number LN2 ln(2)
number LN10 ln(10)
number LOG2E log2(e)
number LOG10E log10(e)
number PI p
number SQRT1_2 1/sqrt(2)
number SQRT2 sqrt(2)
number abs(number a) Абсолютное значение
number acos(number a) Арккосинус
number asin(number a) Арксинус
number atan(number a) Арктангенс
number ceil(number a) Наименьшее целое, не меньшее a
number cos(number a) Косинус
number exp(number a) Экспонента
number floor(number a) Наибольшее целое, не большее a
number log(number a) Натуральный логарифм
number max(number a, number b) Максимум
number min(number a, number b) Минимум
number pow(number a, number b) ab
number random() Случайное число от 0 до 1
number sin(number a) Синус
number sqrt(number a) Квадратный корень
number tan(number a) Тангенс
Date: Дата и время
Date() Инициализация объекта текущей датой и временем
static number UTC(number year, number month, number day [[[, number hrs], number min], number sec]) Возвращает число миллисекунд, прошедших от Epoche (01.01.1970 00:00:00 GMT) до даты, указанной в качестве параметра
static number parse(string time) Возвращает число миллисекунд, прошедших от 01.01.1970 00:00:00 по местному времени до даты, указанной в качестве параметра
number getDate() Число
number getDay() День недели
number getHours() Часы
number getMinutes() Минуты
number getMonth() Месяц
number getSeconds() Секунды
number getTime() Число миллисекунд с Epoche
number getTimeZoneOffset() Смещение временной зоны
Окончание табл. 7
Свойства и методы Описание
number getYear() Год, начиная с 1900
setDate(number Date) Установка даты
setHours(number Hours) Установка часов
setMinutes(number Minutes) Установка минут
setMonth(number Month) Установка месяца
setSeconds(number Seconds) Установка секунд
setTime(number Time) Установка времени в миллисекундах, прошедших с Epoche
setYear(number Year) Установка года
string toGMTString() Преобразование к строке с датой и временем по Гринвичу
string toLocaleString() Преобразование к строке с местными датой и временем
Array: Массив
Array() Пустой массив
Array(number size) Массив с size элементами
Array(a0, a1, ...) Массив с элементами, инициализированными a0, a1, ...
number length Число элементов массива
string join() Объединение элементов массива в строку
reverse() Изменение порядка элементов массива на обратный
sort() Сортировка элементов в массиве
Image: Изображение
Image() Пустое изображение
Image(number w, number h) Пустое изображение с заданными размерами
string src URI ресурса, содержащего изображение

 

В объектно-ориентированном анализе при проектировании и описании объектных библиотек чаще всего рассматриваются иерархии двух видов: иерархия классов (иерархия "is-a") и иерархия объектов (иерархия "part-of"). В иерархии классов отображаются отношения наследования между классами. Поскольку в JavaScript не существует наследования, то нет и иерархии данного типа. В иерархии объектов отображаются отношения агрегации (то есть отношения целого и части) между классами и объектами. На рис. 1 приведена иерархия объектов JavaScript.

 

Для доступа к свойствам и методам объекта применяется операция ".":

 
 

<объект>.<свойство>

<объект>.<метод>(<параметры>)

 

Некоторые свойства и методы класса могут быть статическими. Такие свойства относятся не к конкретному объекту, а к классу в целом. Можно получить доступ к этим свойствам и методам, даже не имея доступа ни к одному из объектов класса. В этом случае операция "." применяется не к объекту, а к классу:

<класс>.<свойство>

<класс>.<метод>(<параметры>)

 

Класс, в котором все свойства и методы являются статическими, называется статическим. Статические свойства, методы и классы в табл. 7 приведены со словом "static" перед идентификатором.

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

Массивы в языке JavaScript являются объектами некоторого предопределенного класса Array. В отличие от C и C++ массивы в JavaScript являются динамическими, то есть размер массива автоматически увеличивается при присваивании значения не существующему элементу массива. Индексы массива нумеруются с нуля. Для доступа к элементам массива используются квадратные скобки. Так же как и обычные переменные, элементы массива не имеют типа. Тип имеют значения элементов. В различных элементах массива могут храниться значения различных типов.

В языке JavaScript имеется возможность определять собственные функции. Определение функции в JavaScript имеет следующий вид:

function <идентификатор>(<параметры>) { ... }

 

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

Для размещения сценариев JavaScript внутри документов HTML используется элемент SCRIPT:

<SCRIPT language=l src=s defer></SCRIPT>

 

Начальный и конечный тэги обязательны. Атрибут language указывает язык, на котором написан сценарий. Для сценариев на языке JavaScript этот атрибут должен принимать значение "JavaScript". В атрибуте src указывается URI файла со сценарием. Атрибут defer указывается, если сценарий не осуществляет вывод на экран при помощи методов write и writeln объекта document для ускорения формирования содержимого страницы.

 

 

Технология Dynamic HTML

 

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

 

Таблица 8
События Dynamic HTML
Атрибут Элемент Событие
onfocus A, AREA, BUTTON, INPUT, LABEL, SELECT, TEXTAREA Попадание в фокус
onblur Потеря фокуса
onchange INPUT, SELECT, TEXTAREA Изменение
onselect INPUT, TEXTAREA Выбор элемента списка
Окончание табл. 8
Атрибут Элемент Событие
onclick Кроме APPLET, BASE, BASEFONT, BDO, BR, FONT, FRAME, FRAMESET, HEAD, HTML, IFRAME, ISINDEX, META, PARAM, SCRIPT, STYLE, TITLE Щелчок
ondblclick Двойной щелчок
onkeydown Клавиша нажата
onkeypress Клавиша нажата и отпущена
onkeyup Клавиша отпущена
onmousedown Кнопка мыши нажата
onmousemove Мышь перемещена
onmouseout Курсор мыши покинул область элемента
onmouseover Курсор мыши перемещен в область элемента
onmouseup Кнопка мыши отпущена
onload BODY, FRAMESET Документ загружен
onunload Документ выгружен
onreset FORM Форма сброшена
onsubmit Форма отправляется





©2015 www.megapredmet.ru Все права принадлежат авторам размещенных материалов.