Функции и объекты

Пользовательские объекты

В данном разделе мы остановимся на трех основных моментах:

• понятие объекта;
• прототип объекта;
• методы объекта Object.

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

Понятие пользовательского объекта

Сначала рассмотрим пример определенного пользователем объекта класса Rectangle, потом выясним, что же это такое:

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.x1-this.x0)*(this.y1-this.y0))");
}

r = new Rectangle(0,0,30,50);

Этот же пример использовался выше в разделе "Функции" для иллюстрации применения конструктора Function. Здесь мы рассмотрим его в более общем контексте.

Функция Rectangle() - это конструктор объекта класса Rectangle, определенного пользователем. Конструктор позволяет создать экземпляр (объект) данного класса. Ведь функция - это не более чем описание некоторых действий. Для того чтобы эти действия были выполнены, необходимо передать функции управление. В нашем примере это делается при помощи оператора new Rectangle. Он вызывает функцию Rectangle() и тем самым генерирует реальный объект  r.

В результате этого создается четыре переменных: x0, y0, x1, y1 - это свойства объекта r. К ним можно получить доступ только в контексте объекта данного класса, например:

up_left_x = r.x0;
up_left_y = r.y0;

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

sq = r.area();

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

На практике довольно редко приходится иметь дело с объектами, созданными программистом. Дело в том, что объект создается функцией-конструктором, которая определяется на конкретной странице и, следовательно, все, что создается в рамках данной страницы, не может быть унаследовано другими страницами. Нужны очень веские основания, чтобы автор Web-узла занялся разработкой библиотеки пользовательских классов объектов. Гораздо проще писать функции для каждой страницы.

Прототип

Обычно мы имеем дело со встроенными объектами JavaScript, такими как Data, Array и String. Собственно, почти все, что изложено в других разделах курса (кроме иерархии объектов DOM) - это обращение к свойствам и методам встроенных объектов. В этом смысле интересно одно свойство объектов, которое носит название prototype. Прототип - это другое название конструктора объекта конкретного класса. Например, если мы хотим добавить метод к объекту класса String, то мы можем это сделать следующим образом:

String.prototype.out = new Function("a", "a.write(this)");

var s = "Привет!";

s.out(document);

// Будет выведено: Привет!

Для объявления нового метода для объектов класса String мы применили конструктор Function. Есть один существенный нюанс: новыми методами и свойствами будут обладать только те объекты, которые порождаются после изменения прототипа объекта. Все встроенные объекты создаются до того, как JavaScript-программа получит управление, что существенно ограничивает применение свойства prototype.

Тем не менее покажем, как можно добавить метод к встроенному в JavaScript классу. Примером будет служить встроенный поименованный Image. Задача состоит в том, чтобы разобрать URL картинки таким же образом, как и URL объекта класса Link, т.е. снабдить объект класса Image дополнительными методами protocol(), host() и т.п.:

function pr()
{
  a = this.src.split(':');
  return a[0]+':';
}

function ho()
{
  a = this.src.split(':');
  path = a[1].split('/');
  return path[2];
}

function pa()
{
  path = this.src.split('/');
  path[0]='';
  path[2]='';
  return path.join('/').split('///').join('/');
}

Image.prototype.protocol = pr;
Image.prototype.host = ho;
Image.prototype.pathname = pa;

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-интерпретатор. Поэтому основная идея нашего подхода заключается в том, чтобы переопределить конструктор Image раньше, чем он будет использован. Поэтому мы создаем объект Image на странице через JavaScript-код. В этом случае сначала происходит переопределение класса Image, а уже после этого создается встроенный объект данного класса.

Примечание. При работе с Internet Explorer данный пример работать не будет. Причина в том, что хотя свойство prototype имелось в наличии у String (см. предыдущий пример), у Image такого свойства в данном браузере уже не существует. Однако в Mozilla Firefox все работает корректно.

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

Object - это класс, элементами которого являются любые объекты JavaScript. У всех объектов этого класса есть общие методы. Таких методов мы рассмотрим три: toString(), valueOf() и assign().

Метод toString() осуществляет преобразование объекта в строку символов (строковый литерал). Он используется в JavaScript-программах повсеместно, но в основном неявно. Например, при выводе числа или строковых объектов. Интересно применение toString() к функциям, например, к функции pr() из предыдущего примера:

document.write(pr.toString());

Результат исполнения:

function pr()
{
  a = this.src.split(':');
  return a[0]+':';
}

Однако, если распечатать таким же образом объект класса Image из того же примера:

document.write(document.i1.toString());

то получим уже следующее: [object] (в Internet Explorer) либо [object Image] (в Netscape Navigator). Таким образом, далеко не всегда метод toString() возвращает строковый эквивалент содержания объекта.

Аналогично ведет себя и метод valueOf(), позволяющий получить значение объекта. В большинстве случаев он работает подобно методу toString(), особенно если нужно выводить значение на страницу. Например, оператор document.write(pr.valueOf()) выдаст то же самое, что и document.write(pr.toString()) выше.

В отличие от двух предыдущих методов, метод assign() позволяет не прочитать, а переназначить какое-либо свойство и метод объекта. Следует заметить, что этот метод работает не во всех браузерах и не со всеми объектами. В общем случае оператор объект.свойство = значение равносильно оператору объект.свойство.assign(значение). Например, следующие операторы равносильны - они перенаправляют пользователя на новую страницу:

window.location = "http://intuit.ru/";
window.location.assign("http://intuit.ru/");