Студопедия

Главная страница Случайная страница

Разделы сайта

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






Символ escape encodeURI encodeURIComponent






%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(), вызываемую при возникновении события изменения содержимого этого поля.






© 2023 :: MyLektsii.ru :: Мои Лекции
Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав.
Копирование текстов разрешено только с указанием индексируемой ссылки на источник.