Главная | Обратная связь | Поможем написать вашу работу!

Символ escape encodeURI encodeURIComponent

⇐ ПредыдущаяСтр 15 из 26Следующая ⇒

%20 %20 %20

` %60 %60 %60

~ %7E ~ ~

! %21!!

@ @ @ %40

# %23 # %23

...

Урок 9. Создание собственных объектов

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

Для создания объектов в JavaScript можно использовать объектный литерал или специальным образом написанную функцию — конструктор объекта.

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

{prop1:value1,..., propN:valueN}

Значением свойства может быть любой поддерживаемый JavaScript тип данных, включая объект:

var Basil = {name:"Basil",surname: "Ivanoff",

university:{name:"PGU",faculty:"AM",cours:5}}

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

alert(Basil.university.name)

Если в качестве значения свойства указывается ссылка на объект-функцию, то такое свойство на самом деле является методом создаваемого объекта:

var Cat = {name:"Mourik", color:"red", voice:mew};

function mew(){

alert("mew... mew...")

}

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

Cat.voice();

Но реально будет вызвана и выполнена функция, реализующая указанный метод (в нашем примере mew()).

Второй способ позволяет быстро создавать экземпляры объекта определенного типа через специальную функцию-конструктор. Если с помощью объектного литерала мы непосредственно создаем экземпляр объекта и сохраняем в некоторой переменной ссылку на него, то здесь мы сначала "описываем" в конструкторе его свойства и методы, а потом операцией new создаем экземпляры этого типа объекта:

// Объявление конструктора

function CatWithoutOwner(sName, sColor) {
this.name = sName
this.color = sColor
}

// Создание экземпляра

myCat = new CatWithoutOwner("Mourik", "red")

Ключевое слово this в конструкторе предназначено для ссылки на конкретный экземпляр объекта, создаваемый операцией new. (Если в функции используется ключевое слово this, то это обязательно конструктор объекта.)

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

// Конструктор объекта personfunction person(name, age) {
this.name = name
this.age = age
}

// создаем экземпляр объекта person

alex = new person("Alex", 50)

// Конструктор объекта CatWithOwnerfunction CatWithOwner(sName, sColor, sOwner) {
this.name = sName
this.color = sColor this.owner = sOwner
}// Создает экземпляр объекта CatWithOwner

cat = new CatWithOwner("Mourik", "red", alex)

// Отображаем имя владельца

alert(cat.owner.name)

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

cat.age = 6;
cat.voice = mew

Теперь у объекта cat появилось свойство age и метод voice, но только у этого объекта. Создаваемые конструктором CatWithOwner() объекты не будут иметь указанных свойства и метода.

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

CatWithOwner.prototype.age = null

CatWithOwner.prototype.voice = mew

// теперь создаем экземпляр

var cat1 = new CatWithOwner("Mourik", "red", alex)

// у него есть свойство age (значение null)

// и метод voice()

alert(cat1.age);

cat1.voice();

// можем изменить значение свойства age

cat1.age = "red"

В конструкторе объекта вместо имен свойств (да и методов) можно использовать индексы:

function CatWithOwner(sName, sColor, sOwner) {
this[1] = sName
this[2] = sColor this.owner = sOwner
}

cat1 = new CatWithOwner("Mourik", "black", alex)

Теперь к свойствам, соответствующим имени и цвету, можно обращаться по индексу:

alert(cat1[1])

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

alert(cat1["owner"])

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

function who() {
var result = "Кот " + this.name + ",\nвладелец которого" + this.owner.name
return result
} // Новый конструктор объекта CatWithOwnerfunction CatWithOwner(sName, sColor, sOwner) {
this.name = sName
this.color = sColor this.owner = sOwner this.whose = who
}

// Новый кот

var cat2 = new CatWithOwner();

// Чей это кот

alert(cat2.who())

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

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

myobj = new Number();myoj["prop"] = "*********"
delete myobj.prop

В завершение рассказа о пользовательских объекта, в конструкторах которых применялось ключевое слово this для создания ссылки на текущий экземпляр объекта, напомним еще об одном случае использования этого ключевого слова. Его можно использовать в коде обработчика события элемента HTML для ссылки на объект, соответствующий этому элементу HTML:

<INPUT TYPE="text" NAME="age" SIZE=3

onChange="validate(this)">

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

Упражнения

1. Создать массив на основе объекта Object. Посмотреть, если у него свойство length, присущее массивам, созданным с помощью объекта Array.

2. Распечатать свойство constructor для всех известных объектов JavaScript. С помощью свойства prototype объекта Object для всех создаваемых в сценарии объектов добавить метод propertiesList(), возвращающий массив, содержащий названия всех свойств объекта и их значения.

3. Разработать объект Collection, позволяющий хранить и выбирать любые объекты JavaScript с использованием строкового ключа. Реализовать методы этого объекта: add(ключ, объект) — добавление объекта в семейство Collection, remove(ключ) — удаление объекта, count() — возвращает количество объектов в семействе, item(ключ) — возвращает объект по значению его ключа.

⇐ Предыдущая 10 11 12 13 141516 17 18 19 Следующая ⇒