Объекты
Объект — это главный тип данных JavaScript. Любой другой тип данных имеет объектовую "обертку" — Wrapper. Это означает, что прежде чем можно будет получить доступ к значению переменной того или иного типа, происходит конвертирование переменной в объект, и только после этого выполняются действия над значением. Тип данных Object сам определяет объекты.
В данном разделе мы остановимся на трех основных моментах:
- понятие объекта;
- прототип объекта;
- методы объекта Object.
Мы не будем очень подробно вникать во все эти моменты, так как при программировании на стороне браузера чаще всего обходятся встроенными средствами JavaScript. Но поскольку все эти средства — объекты, нам нужно понимать, с чем мы имеем дело.
Понятие объекта
Сначала рассмотрим пример произвольного, определенного пользователем объекта, потом выясним, что же это такое:
function Rectangle(a,b,c,d)
{
this.x0 = a;
this.y0 = b;
this.x1 = c;
this.y1 = d;
this.area = new Function("return Math.abs(this.x0-this.x1)*Math.abs(this.y0-this.y1)");
this.perimeter = new Function("return (Math.abs(this.x0-this.x1)
+Math.abs(this.y0-this.y1))*2");
}
c = new Rectangle(0,0,100,100);
document.write(c.area());
Результат исполнения:
10000
Этот же пример использовался в разделе "Функции" для иллюстрации применения конструктора функции. Здесь мы рассмотрим его в более общем контексте.
Функция rectangle() — это конструктор объекта класса Rectangle, который определяется пользователем. Конструктор позволяет создать реальный объект данного класса. Ведь функция — это не более чем описание некоторых действий. Для того чтобы эти действия были выполнены, необходимо передать функции управление. В нашем примере это делается при помощи оператора new. Он вызывает функцию и тем самым генерирует реальный объект.
Создается четыре переменных: x0, y0, x1, y1 — это свойства объекта Rectangle. К ним можно получить доступ только в контексте объекта данного класса, например:
up_left_x = c.x0;
up_left_y = c.y0;
Кроме свойств мы определили внутри конструктора два объекта типа Function(), применив встроенные конструкторы языка JavaScript, — area и perimeter. Это методы объекта данного класса. Вызвать эти функции можно только в контексте объекта класса Rectangle:
sq = c.area();
length = c.perimeter();
Таким образом, объект — это совокупность свойств и методов, доступ к которым можно получить, только создав при помощи конструктора объект данного класса и использовав его контекст.
На практике довольно редко приходится иметь дело с объектами, созданными программистом. Дело в том, что объект создается функцией-конструктором, которая определяется на конкретной странице и, следовательно, все, что создается в рамках данной страницы, не может быть унаследовано другими страницами. Нужны очень веские основания, чтобы автор Web-узла занялся разработкой библиотеки классов объектов пользователя. Гораздо проще писать функции для каждой страницы.
Прототип
Обычно мы имеем дело со встроенными объектами JavaScript. Собственно, все, что изложено в других разделах курса — это обращение к свойствам и методам встроенных объектов. В этом смысле интересно свойство объектов, которое носит название prototype. Прототип — это другое название конструктора объекта конкретного класса. Например, если мы хотим добавить метод к объекту класса String:
String.prototype.out = new Function("a","a.write(this)");
...
"Привет!".out(document);
Результат исполнения:
Привет!
Для объявления нового метода для объектов класса String мы применили конструктор Function. Есть один существенный нюанс: новыми методами и свойствами будут обладать только те объекты, которые порождаются после изменения прототипа объекта. Все встроенные объекты создаются до того, как JavaScript-программа получит управление, что существенно ограничивает применение свойства prototype.
Тем не менее покажем, как можно добавить метод к встроенному в JavaScript классу объектов. Примером будет служить встроенный поименованный Image. Задача состоит в том, чтобы разобрать URL картинки таким же образом, как и URL объекта класса Link:
function prot()
{
a = this.src.split(':');
protocol = a[0]+":";
return protocol;
}
function host()
{
a = this.src.split(':');
path = a[1].split('/');
return path[2];
}
function pathname()
{
a = this.src.split(':');
path = a[1].split('/');
b = new array();
for(i=3;i<path.length;i++) b[i-3]="path[i];<br" c = b.join('/');
return "/"+c;
}
Image.prototype.protocol = prot;
Image.prototype.host = host;
Image.prototype.pathname = pathname;
...
document.write("<IMG NAME=i1 SRC='image1.gif'><BR>");
document.write(document.i1.src+"<BR>");
document.write(document.i1.protocol()+"<BR>");
document.write(document.i1.host()+"<BR>");
document.write(document.i1.pathname()+"<BR>");
Основная идея заключается в том, чтобы переопределить конструктор раньше, чем он будет использован. HTML-парсер разбирает HTML и создает встроенные объекты раньше, чем запускается JavaScript-интерпретатор. Из этого следует, что объект на странице нужно создать через JavaScript-код. В этом случае сначала происходит переопределение объекта Image, а уже после этого создается встроенный объект данного класса. При работе с Internet Explorer все иначе. Если на свойство prototype у строкового объекта он не "ругается", то для Image такое свойство уже не определено.
Методы объекта Object
Object — это объект и, следовательно, у него могут быть методы. Таких методов мы рассмотрим три: toString(), valueOf() и assign().
Метод toString() осуществляет преобразование объекта в строку символов. Он используется в JavaScript-программах повсеместно, но неявно. Например, при выводе числа или строковых объектов. Интересно применение toString() к функциям:
document.write(prot.toString()+"<BR>");
Результат исполнения:
function prot() { a = this.src.split(':'); protocol = a[0]+":"; return protocol; }
Здесь мы используем функцию prot() из примера с прототипом. Если распечатать таким же образом объект Image, то получим следующее:
картинка:[object]
Таким образом, далеко не всегда метод toString() возвращает строковый эквивалент содержания объекта. Он может просто вернуть его тип. Internet Ехplorer при этом возвращает "Object", в то время как Netscape Navigator — "object Image".
Аналогично ведет себя и метод valueOf(). Этот метод позволяет получить значение объекта. В большинстве случаев он работает подобно методу toString(), особенно если нужно выводить значение на страницу:
document.write(prot.valueOf()+"<BR>");
Результат исполнения:
function prot() { a = this.src.split(':'); protocol = a[0]+":"; return protocol; }
Как видим, результат тот же, что и в методе toString().
В отличие от двух предыдущих методов, assign() позволяет не прочитать, а переназначить свойства и методы объекта. Данный метод используется в контексте присваивания объекту некоторого значения:
object = value; <=> object.assign(value);
Рассмотрим пример:
c = new Image();
c.src = "image1.gif";
b =new Image();
b.src = "image2.gif";
Image.prototype.assign = new Function("a","this.src = a.src;");
...
<A HREF='javascript:window.document.main.document.i2.assign(c);
void(0);'>Покрасить картинку</A>
В данном примере мы применяем метод assign() не внутри JavaScript-кода, а в обычной HTML-разметке. При этом перед использованием метода мы переопределили его своей функцией. Пользователей Internet Explorer следует предупредить, что здесь мы их немножко обманываем, так как переназначить прототип Image в Internet Explorer мы в данном случае не можем.
|