LEKCIJA_10

department.name = "rk6"

department.chief = "Norenkov I.P."

department.number_of_workers = 23;

Второй способ доступа к свойствам - через массивы. Свойства и массивы в JavaScript - довольно близки, фактически они представляют собой различные интерфейсы к одной и той же структуре данных. Так, например, можно определить свойства объекта department следующим образом:

department["name"] = "rk6"

department["chief"] = "Norenkov I.P."

department["number_of_workers "] = 23

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

function show_props(obj, obj_name) {

var result = ""

for (var i in obj)

result += obj_name + "." + i + " = " + obj[i] + "\n"

return result

}

Так функция, show_props(department, "department") выведет следующий результат: department.name = rk6

department.chief = Norenkov I.P.

department.number_of_workers = 23

Создание новых объектов

И клиент и сервер JavaScript имеют набор предопределенных объектов. Кроме этого, есть возможность создавать свои собственные объекты, для этого необходимо:

1. Определить тип объекта с помощью конструктора.

2. Создать экземпляр объекта с помощью оператора new.

Для того, чтобы определить тип объекта, создается функция, в которой определяется имя, свойства, и методы объекта. Например, предположим, что мы хотим создать объект типа отдел. Мы хoтим, чтобы он назывался department и имел свойства - название(name), руководитель(chief), число сотрудников(number_of_workers) и тема над которой работает отдел(theme). Функция будет выглядеть следующим образом:

function department(name, chief, number_of_workers, theme)

{

this.name = name

this.chief = chief

this.number_of_workers = number_of_workers

}

Заметим, что значения свойств объекта определяются значениями, переданными функции. Теперь создадим объект типа department с именем ourdep:

ourdep = new department("rk6", "Norenkov I.P.", 23)

В том операторе объекту ourdep назначаются следующие свойства: ourdep.name присваивается строковое значение "rk6", ourdep. number_of_workers - целое 23 и т.д. Можно создать любое количество таких объектов, еще один пример: iu6dep = new department("iu6", "Smirnov U.M", 34). Объект может иметь свойства, которые являются свойствами другого объекта. Предположим мы определяем объект person:

function person(name, age, sex) {

this.name = name

this.age = age

this.sex = sex

}

и создаем два экземпляра этого объекта:

fed = new person("Fedoruk V.G.", 43, "M")

trudon = new person("Trudonoshin V.A.", 46, "M")

Теперь мы хотим переопределить объект department, чтобы он включал новое свойство - сотрудников:

function department(name, chief,number_of_workers, collab) {

this.name = name

this.chief = chief

this.number_of_workers = number_of_workers

this.collab =collab

}

Создаем новые объекты типа department:

ourdep = new department("rk6", "Norenkov I.P.", 23,trudon)

iu6dep = new department("iu6", "Smirnov U.M", 34,fed)

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

iu6.collab.name

Заметим, что всегда можно добавить свойства к ранее определенному объекту, например оператор rk6.theme = "rk6-07" добавит свойство theme к rk6, и назначит ему значение "rk6-07". Однако это не повлияет на другие объекты, для добавления новых свойств ко всем объектам данного типа необходимо изменить определение объекта.

Использование индексов для свойств объекта

В Navigator 2.0, можно обратиться к свойствам объекта по их названию или по их порядковому индексу. В Navigator3.0, если первоначально свойство определено с помощью названия, то при обращении к нему нужно использовать название, если первоначально воспользовались индексом, то и обращение должно быть с индексом. Исключением из этого правила - объекты типа form, к ним можно обратиться как к элементу массива в соответствии с их порядковым номером (он определяется порядком появления формы в документе) или по имени. Например, если второй тег <FORM> в документе имеет атрибут NAME "myForm", можно обратиться к этой форме двумя способами:

document.forms[1]

document.forms["myForm"]

Определение свойств объекта по умолчанию

Используя свойство prototype можно назначать свойства всем представителям данного типа, после этого их можно индивидуально переопределить. В следующем примере имена всех руководителей отделов (объект типа department) определяется как null, затем они могут быть изменены

department.prototype.chief=null

Методы

Определение методов. Метод - функция, связанная с объектом. Метод определяется таким же способом, что и стандартная функция, для ассоциации с существующим объектом используется следующий синтаксис:

object.methodname = function_name

где object - существующий объект, methodname - имя, которое назначается методу, function_name - имя функции. Метод вызывается следующим образом:

Object.methodname (params);

Можно определить методы для объекта в его конструкторе, например можно определить функцию, которая выводит свойства ранее определенного объекта department:

function displayDep() {

var result = " this.name + " " + this.chief + " " + this.number_of_workers;

show_props (result);

}

где show_props - функция из раздела “Функции” Можно включить эту функцию в качестве метода department, добавив в конструктор строку

this.displayDep = displayDep;

То есть полное определение объекта department будет выглядеть так:

function department(name, chief, number_of_workers, collab) {

this.name = name

this.chief = chief

this.number_of_workers = number_of_workers

this.collab =collab

this.displayDep = displayDep

}

Тогда вызов метода displayDep для конкретных экземпляров выполняется следующим образом :

ourdep.displayDep()

iu6dep.displayDep()

Использование this для ссылок на объект

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

function validate(obj, lowval, hival) {

if ((obj.value < lowval) || (obj.value > hival))

alert("Invalid Value!")

}

Теперь можно вызвать validate в обработчике событий (см.далее) onChange при заполнении формы:

<INPUT TYPE = "text" NAME = "age" SIZE = 3 onChange="validate(this, 18, 99)">

Здесь this относится к вызывающему объекту. При комбинировании со свойствами формы this может относиться к текущей форме родительского объекта. В следующем примере форма myForm содержит объекты text и button. Когда пользователь нажимает кнопку, значение объекта text устанавливается равным имени формы. Обработчик событий onClick использует this.form для ссылки на родительскую форму myForm.

<FORM NAME="myForm">

Form name:<INPUT TYPE="text" NAME="text1" VALUE="Moscow">

<P> <INPUT NAME="button1" TYPE="button" VALUE="Show Form Name" onClick="this.form.text1.value=this.form.name"> </FORM>

Удаление объекта

В JavaScript для Navigator 2.0 нельзя удалять объекты - они существуют, пока вы не покинете страницу, содержащую объект. В JavaScript для Navigator 3.0, можно удалять объекты, устанавливая ссылку на пустой указатель (если это - последняя ссылка на объект) в этом случае объект удаляется немедленно.

Встроенные объекты и их методы

Некоторые объекты встроены в JavaScript и могут использоваться как в клиенте, так и на сервере. Ими являются объекты типа Array, Boolean, Date, Function, Math, Number, and String.

Объекты Array

JavaScript не имеет явного типа данных -массив(array). Однако, можно использовать встроенный объект Array и его методы и работать с массивами в приложениях. Объект Array имеет методы для соединения, перевертывания и сортировки массивов. У него есть свойство для определения длины массива. Массив есть упорядоченный набор значений, к которым можно обратиться по имени и индексу. Создание массивов:

• arrayObjectName = new Array([arrayLength])

• arrayObjectName = new Array([element0, element1, ..., elementn])

аrrayObjectName является или названием нового объекта или свойством существующего объекта, аrrayLength - начальная длина множества. Можно получить доступ к этому значению используя свойство length; elementn - список значений для элементов множества, когда использована вторая форма инициализации массива, его длина определяется количеством аргументов.

Объект Array имеет следующие методы:

- join - связывает все элементы массива в строку;

- reverse переворачивает элементы массива: первый элемент становится последним и наоборот;

- sort сортирует элементы массива.

Например, предположим, что мы определяем следующий массив:

myArray = new Array("Wind","Rain","Fire")

тогда myArray.join() возвратит "Wind,Rain,Fire";

myArray.reverse преобразует массив так, что myArray[0] есть"Fire", myArray[1] есть "Rain", и myArray[2] есть "Wind".

myArray.sort сортирует элементы массива в лексикографическом порядке, так что myArray[0] есть "Fire", myArray[1] есть "Rain", и myArray[2] есть "Wind".

Определение элементов массива. Можно определять элементы массива с помощью оператора присваивания, например:

emp[1] = "Casey Jones"

emp[2] = "Phil Lesh"

emp[3] = "August West"

Можно это сделать при при создании массива:

myArray = new Array("Hello", myVar, 3.14159)

В следующем примере создается двумерный массив и выводится на экран.

a = new Array(4)

for (i=0; i < 4; i++) {

a[i] = new Array(4)

for (j=0; j < 4; j++) {

a[i][j] = "["+i+","+j+"]"

}

}

for (i=0; i < 4; i++) {

str = "Row "+i+":"

for (j=0; j < 4; j++) {

str += a[i][j]

}

document.write(str,"<p>")

}

Этот пример показывает следующие результаты:

Row 0:[0,0][0,1][0,2][0,3]

Row 1:[1,0][1,1][1,2][1,3]

Row 2:[2,0][2,1][2,2][2,3]

Row 3:[3,0][3,1][3,2][3,3]

Можно обратиться к элементам массива используя значение элемента или его индекс. Например, в следующем примере myArray = new Array("Wind","Rain","Fire") Можно обратиться к первому элементу массива как myArray [0] или myArray ["Wind"].

Объекты Boolean

Встроенные объекты Boolean нужно использовать тогда, когда необходимо преобразовать не-boolean значение в boolean значение. Можно использовать Boolean в любом месте JavaScript, где ожидается значение такого типа. JavaScript возвращает значение объекта Boolean автоматически вызывая метод valueOf.

Создание объектa Boolean:

booleanObjectName = new Boolean(value)

booleanObjectName - или имя нового объекта или свойство существующего, value - начальное значение объекта. Значение преобразуется к типу boolean, если необходимо. Если значение опущено или 0, null, false или пустая строка "", объект инициализируется значением false, Во всех других случаях, включая строку "false", создается объект с начальным значением true. В следующем примере создаются два объекта Boolean

bfalse = new Boolean(false)

btrue = new Boolean(true)

Объект Date

JavaScript не имеет данных типа date. Однако, можно использовать объект Date и его методы для работы с датами и временами в приложениях. Объект Date имеет большое количество методов для установки, получения, и управления датами. У него нет свойств. JavaScript обращается с датами подобно языку Java. Эти два языка имеют много одинаковых методов и хранят даты как число миллисекунд. прошедших с 1 января 1970г, 00:00:00.

Примечание. В настоящее время нельзя работать с датами до 1 января 1970г.

Создание объекта Date:

dateObjectName = new Date([parameters])

где dateObjectName - имя создаваемого объекта, это может быть новый объект или свойство существующего объекта. Параметры могут задаваться следующим образом:

- опущены: создается текущие дата и время, например, today= new Date();

- определяется строка в формате “месяц день, год часы:минуты:секунды”, например, Xmas95 =new Date("December 25, 1995 13:30:00"). Если опускаются часы, минуты или секунды они устанавливаются в нуль;

- задается целое значение года, месяца и дня, например, Xmas95 = new Date(95,11,25).

- задается целое значение года, месяца, дня, часов, минут, секунд.

Методы объекта Date

Методы для обработки дат и времен можно разделить на следующие категории:

- "set" методы, для установки дат и времен

- "get" методы, для получения дат и времен;

- "to" методы, для получения строковых значений;

- parse и UTC методы, для грамматического разбора строк с датами.

С помощью "get" и "set" методов можно получать и устанавливать секунды, минуты, часы, дни месяца, дни недели, месяцы, и годы независимо друг от друга. Имеется метод getDay, возвращающий день недели, но нет соответствующего метода setDay, поскольку день недели устанавливается автоматически.

В методах используются следующие целые значения:

-секунды и минуты: 0 - 59

-часы: 0 - 23

-день недели: 0 - 6

-день месяца: 1 - 31 -месяц: 0 (январь) - 11 (декабрь)

-год: с 1900

Например, если вы установили следующую дату:

Xmas95 = new Date("December 25, 1995")

то Xmas95.getMonth() возвратит 11, а Xmas95.getYear() возвратит 95. Методы getTime и setTime полезны для сравнения дат. Метод getTime возвращает число миллисекунд начиная с 01.01.1970. Следующий пример выводит число дней, прошедших в текущем году:

today = new Date()

endYear = new Date("December 31, 1990") // Установили день и месяц endYear.setYear(today.getYear()) // Установили текущий год

msPerDay = 24 * 60 * 60 * 1000 // Число миллисекунд за день

daysLeft = (endYear.getTime() - today.getTime()) / msPerDay

daysLeft = Math.round(daysLeft) document.write("Number of days left in the year: " + daysLeft)

В этом примере создается объект Date c именем today, который содержит текущую дату. endYear определяет начало текущего года. Тогда, используя число миллисекунд за день, вычисляем число дней между today и endYear, используя getTime, и округляем число дней до целого.

Метод parse полезен для присваивания даты существующему объекту из строкового значения. Например, следующий пример использует parse и setTime для назначения даты объекту mydate:

mydate = new Date() mydate.setTime(Date.parse("Aug 9, 1995"))

Пример использования объекта Date. В этом примере в HTML области показываются непрерывно обновляемые цифровые часы. Это осуществимо, поскольку есть возможность динамически изменить содержание области текста в JavaScript (в отличие от обычного текста, который нельзя модернизировать без перезагрузки документа). Вывод в навигаторе выглядит следующим образом: Конец формы

Раздел <BODY> документа выглядит так:

<BODY onLoad="JSClock()">

<FORM NAME="clockForm"> The current time is <INPUT TYPE="text" NAME="digits" SIZE=12 VALUE=""> </FORM> </BODY>

Тег <BODY> включает обработчик событий onLoad. Когда страница загружается обработчик вызывает функцию JSClock, определяемую в разделе <HEAD>. Форма clockForm включает простое текстовое поле digits, в котором инициализирована пустая строка. В разделе <HEAD> документа JSClock определяется следующим образом:

<HEAD> <SCRIPT language="JavaScript">

<!-- function JSClock() {

var time = new Date()

var hour = time.getHours()

var minute = time.getMinutes()

var second = time.getSeconds()

var temp = "" + hour

temp += ((minute < 10) ? ":0" : ":") + minute

temp += ((second < 10) ? ":0" : ":") + second

document.clockForm.digits.value = temp

id = setTimeout("JSClock()",1000) } //-->

</SCRIPT>

Функция JSClock сначала создает новый объект Date, с именем time; так как аргументы не заданы, устанавливаются текущие значения. Запросы к getHours, getMinutes, и getSeconds выделяют значение текущего часа, минуты и секунды. Следующие четыре оператора строят строковое значение времени. Полученное значение присваивается области текста: document.clockform.digits.value = temp, тем самым время будет показано в документе. Конечный оператор в функции - рекурсивный запрос к JSClock: id=setTimeout("JSClock()",1000) Встроенная в JavaScript функция setTimeout определяет время задержки для для обращения к JSClock. Второй аргумент указывает задержку в 1000 миллисекунд. Таким образом модернизируется показ времени в форме с интервалом одна секунда. Обратите внимание, функция возвращает значение присваиваемое id, которое в данном случае нигде не используется, но может быть использовано в методе clearTimeout для обнуления.

Объект Function

Создание объекта Function:

functionObjectName = new Function ([arg1, arg2, ... argn], functionBody)

functionObjectName - имя переменной или свойство существующего объекта. При использовании свойств функции, functionObjectName должен быть или именем существующего объекта или свойством существующего объекта. аrg1, arg2, ... argn - аргументы, которые используются функцией как формальные параметры. Каждый из параметров должен быть строкой, которая допустима в JavaScript как идентификатор; например " x "или"theForm ". functionBody - строка, специфицирующая JavaScript-коды, которые нужно компилировать как тело функции.

Объекты function обрабатываются каждый раз, когда они используются. Это менее эффективно, чем объявление функции и их вызов, потому что объявленные функции компилируются.

Следующий пример назначает функцию переменной setBGColor. Эта функция устанавливает цвет фона текущего документа.

var setBGColor = new Function("document.bgColor='antiquewhite'")

Для вызова объекта Function, нужно специфицировать имя переменной, как будто это функция, например:

var colorChoice="antiquewhite" if (colorChoice=="antiquewhite") {setBGColor()}

Можно назначить функцию обработчиком событий следующими способами:

document.form1.colorButton.onclick=setBGColor

<INPUT NAME="colorButton" TYPE="button" VALUE="Change background color" onClick="setBGColor()">

Создание переменной setBGColor похоже на обычное декларирование функции.

function setBGColor() { document.bgColor='antiquewhite' }

Назначение функции переменной подобно объявлению функции, но есть различия: когда для функции назначается переменная setBGColor = new Function("..."), setBGColor является переменной, текущее значение которой относиться к функции, созданной с помощью new Function(), когда создается функция с помощью function setBGColor() {...}, setBGColor не является переменной, это имя функции.

Объект Math

Встроенный объект Math имеет свойства и методы для ма- тематических констант и функций. Например, свойство PI объекта Math имеет значение 3.141..., который можно использовать как Math.PI Стандартные математические функции являются методами Math. Они включают тригонометрические, логарифмические, показательные, и другие функции. Например, если нужно использовать синус, следует писать Math.sin (1.56) Обратите внимание что все тригонометрические методы Math используют аргументы в радианах. В следующей таблице приведены методы Math.

Метод	Описание
Abs	абсолютное значение
sin, cos, tan	стандартные тригонометрические функции, аргумент в радианах
acos, asin, atan	обратные тригонометрические функции, возвращают значение в радианах
exp, log	экспонента и натуральный логарифм
Ceil	возвращает наименьшее целое, большее или равное аргументу
floor	возвращает наибольшее целое, меньшее или равное аргументу
Min, max	возвращает меньшее или большее (соответственно) из двух аргументов
Pow	возведение в степень, первый аргумент основание, второй показатель степени
round	округляет аргумент до ближайшего целого
Sqrt	квадратный корень

Часто удобно использовать оператор with, когда есть раздел, в котором используется набор констант и методов, чтобы не повторять слово "Math".

Например:

with (Math) { a = PI * r*r; y = r*sin(alfa); x = r*cos(alfa) }

  1.7.6 Объект Number.

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

biggestNum = Number.MAX_VALUE

smallestNum = Number.MIN_VALUE

infiniteNum = Number.POSITIVE_INFINITY

negInfiniteNum = Number.NEGATIVE_INFINITY

notANum = Number.NaN

В следующей таблице приведены свойства Number:

Название	Описание
MAX_VALUE	наибольшее значение
MIN_VALUE	наименьшее значение
NaN	неопределенность
NEGATIVE_INFINITY	отрицательная бесконечность
POSITIVE_INFINITY	положительная бесконечность

Объект String

У JavaScript нет типа данных string. Однако можно пользоваться объектом String и его методами для работы со строками в прилoжениях. Этот объект имеет множество методов и одно свойство - длину строки.

Создание объекта String:

stringObjectName = new String(string)

stringObjectName - имя нового объекта String, string - любая строка.

Например, следующий оператор создает объект String, названный mystring:

mystring = new String ("Hello, World!")

аналогичные действия выполняет и оператор:

mystring="Hello, World!"

Строковые литералы также являются объектами String. Свойство length для строки указывает число символов в ней, так x = mystring.length присвоит значение х равное тринадцати, потому что "Hello, World!" имеет 13 символов.

Объект String имеет два типа методов - те, которые возвращают в качестве результата преобразованную исходную строку (как, например, подстроку или строку, у которой все символы переведены в верхний регистр) и те, которые возвращают строку в формате HTML (например link).

Например mystring.toUpperCase() and "hello,world!".toUpperCase() возвратят строку "HELLO, WORLD!". Метод substring имеет два аргумента и возвращает подстроку, располагающуюся между указанными номерами, например, mystring.substring(4, 9) возратит строку "o,Wo".

Методы bold и link используются для HTML- форматирования, первый создает жирный текст, второй гипертекстовую ссылку. Например, для создания ссылки к гипотетическому URL с помощью метода link можно воспользоваться следующим оператором:

mystring.link("http://www.helloworld.com")

Следующая таблица показывает методы объектов Sring:

Метод	описание
anchor	создает HTML-якорь
big, blink, bold, fixed, italics, small, strike, sub, sup	создает строку HTML, соответствующего вида
charAt	возвращает символ по его номеру в строке
ndexOf, lastIndexOf	возвращают первую (последнюю) позицию специфицированной подстроки
Link	создает гипертекстовую ссылку
Split	разбивает объект String на массив подстрок
substring	извлекает подстроку из строки
toLowerCase, toUpperCase	возвращает строку в нижнем или верхнем регистре, соответственно

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

Функция isNaN

Функция оценивает аргумент на неопределенность.

Синтаксис: isNaN(testValue)

где testValue -значение, которое вы хотите оценить.

На платформах, которые поддерживают NaN, функции parseFloat и parseInt (см. ниже) возвращают "NaN", когда значение не является числом. isNaN возвращает true если "NaN," и false в другом случае. В следующей программе оценивается значение floatValue и вызывается соответствующая процедура:

floatValue=parseFloat(toFloat) if (isNaN(floatValue))

{ notFloat() } else { isFloat() }

Функции parseInt и parseFloat

Эти функции возвращают числовое значение строкового аргумента.

Синтаксис parseFloat: parseFloat(str)

parseFloat выполняет лексикографический разбор строки и, если это возможно, возвращает число с плавающей точкой.

Если в строке встречаются символы отличные от знака (+ или -), цифры (0-9), десятичной точки или экспоненты, разбор прекращается и возвращается значение, полученное до этого момента, остальные символы игнорируются. Если самый первый символ не может быть преобразован в число возвращается"NaN" (not a number).

Синтаксис parseInt: parseInt(str [, radix])

parseInt выполняет лексикографический разбор первого аргумента - строки str, и возвращает целое по основанию, заданным вторым необязательным аргументом radix. Например radix 10 показывает, что строку нужно преобразовывать в десятичное число, 8 в восьмеричное, 16 в шестнадцатиричное и так далее. При основании больше десяти для обозначения цифр используются буквы в алфавитном порядке. Преобразование выполняется до первого недопустимого символа, остальные символы игнорируются, если первый символ не может быть преобразован возвращается "NaN".

2. Включение JavaScript в HTML- документы

Существуют следующие способы подключения JavaScript- программ к HTML документу:

1. Использование тега <SCRIPT>.

2. Объявление JavaScript-файла, содержащего текст программы.

3. Определение JavaScript-выражения в качестве значения для HTML-атрибутов.

4. Объявление JavaScript-программы в качестве обработчика событий.

Использование тега SCRIPT

Тег <SCRIPT> - расширение к HTML, который может включать любое число JavaScript-операторов.

<SCRIPT> JavaScript операторы ... </SCRIPT>

Документ может иметь любое количество тегов SCRIPT. В теге SCRIPT можно определить версию браузера, для которого предназначены операторы JavaScript:

<SCRIPT LANGUAGE= "JavaScript"> определяет JavaScript для Navigator 2.0.

<SCRIPT LANGUAGE= "JavaScript1.1"> определяет JavaScript для Navigator 3.0.

Операторы в пределах тега <SCRIPT> игнорируются, если браузер пользователя не имеет уровня поддержки JavaScript, указанного в признаке LANGUAGE. Если признак LANGUAGE опущен, Navigator 2.0 принимает LANGUAGE="JavaScript". Navigator 3.0 предполагает LANGUAGE="JavaScript1.1". Поскольку появился VBScript (альтернатива JavaScript, базирующаяся на Visual Basic, разработка Microsoft), то признак LANGUAGE становиться обязательным.