Самый быстрый способ выучить английский язык
Раздел: Сайтостроение / JavaScript /
Классы, конструкторы и прототипы
Пришло время познакомиться с объектно-ориентированным программированием в JavaScript (ООП). Знакомство будет кратким и весьма поверхностным. Однако опытным программистам этого будет для начала вполне достаточно. А неопытным как всегда советую изучить полный обучающий курс по JavaScript:
>>> JavaScript, jQuery и Ajax с нуля до гуру >>>
Мы уже немного сталкивались с объектами здесь и здесь. Сегодня поговорим о них чуть более подробно. Принципы ООП я здесь рассматривать не буду. Подразумевается, что вы их знаете. В данной статье только то, что имеет отношение к JavaScript.
Классы в JavaScript
JavaScript не обладает полной поддержкой классов, как другие “полноценные” языки программирования, такие как Паскаль или С++. Однако в JavaScript имеется возможность создавать псевдоклассы, используя функции-конструкторы и прототипы объектов.
И, тем не менее, далее в этой статье будет использоваться термин “класс”, несмотря на то, что описываемые этим термином сущности не являются классом в полном смысле этого слова.
ПРИМЕЧАНИЕ
JavaScript 2.0 поддерживает настоящие классы. Но, поскольку ещё далеко не все пользователи работают с браузерами, которые поддерживают JavaScript 2.0, эта статья имеет отношение к JavaScript 1.5.
Конструкторы в JavaScript
Мы уже создавали массивы с помощью конструктора Array(). Таким образом можно создавать любые другие объекты:
//Создаём объект CurrDate "класса" ДАТА //с помощью конструктора Date() var CurrDate = new Date(); //Создаём объект M "класса" МАССИВ //с помощью конструктора Array() var M = new Array(8);
То есть для создания объекта мы сначала объявляем переменную, а затем инициализируем её с помощью оператора new, после которого указывается имя функции-конструктора.
Оператор new создаёт новый пустой объект без
каких-либо свойств, а затем вызывает конструктор, в который передаётся
только что созданный объект в виде значения ключевого слова this (если изучали ООП, то знаете, что это такое).
Функция-конструктор (или просто конструктор) выполняет инициализацию нового созданного объекта, то есть устанавливает значения всех свойств объекта в нужное программисту состояние. Свойства могут быть инициализированы непосредственно в теле конструктора константами или параметрами, которые передаются в конструктор.
Создать свой собственный конструктор можно довольно просто. Надо лишь
написать функцию, добавляющую новые свойства к объекту, на который ссылается
ключевое слово this.
//Создаём конструктор
function Coord(x, y)
{
this.X = x;
this.Y = y;
this.Z = 0;
}
//Создаём два объекта "класса" Coord
var Point1 = new Coord(15, 20); //Point1 = {X:15, Y:20, Z:0};
var Point2 = new Coord(7, 4); //Point2 = {X:7, Y:4, Z:0};
//Используем объекты в сценарии
document.write('Point1.X = ' + Point1.X + '<br>');
document.write('Point1.Y = ' + Point1.Y + '<br>');
document.write('Point1.Z = ' + Point1.Z + '<br>');
document.write('Point2.X = ' + Point2.X + '<br>');
document.write('Point2.Y = ' + Point2.Y + '<br>');
document.write('Point2.Z = ' + Point2.Z + '<br>');
В этом примере мы написали функцию-конструктор Coord, который
инициализирует три свойства объекта: X, Y, Z.
Причём значения X и Y может задавать программист
при создании нового объекта, а Z всегда инициализируется равным нулю (в нашем примере).
Далее мы создаём два объекта и используем их в нашем сценарии.
Прототипы в JavaScript
Надеюсь, вы знаете, что функции объекта называются методами. Создать метод можно, например, так:
//Создаём конструктор
function Coord(x, y)
{
this.X = x;
this.Y = y;
this.Z = 0;
}
//Создаём объект "класса" Coord
var Point = new Coord(15, 20);
Point.Z = 2;
//Создаём метод
Point.GetSum = function() {return this.X + this.Y + this.Z}
//Вызываем метод
Point.GetSum();
Можно сделать то же самое другим способом (этот способ более подходит для ООП):
function Coord(x, y)
{
this.X = x;
this.Y = y;
this.Z = 0;
//Создаём метод
this.GetMul = function() {return this.X * this.Y * this.Z}
}
Вызов метода будет таким же, как и в предыдущем примере.
Все объекты в JavaScript содержат внутреннюю ссылку на объект - прототип. Все свойства прототипа становятся свойствами другого объекта, для которого он является прототипом. Таким образом прототип является родителем для своего объекта, и объект наследует все свойства своего прототипа.
Когда мы делаем вот так:
function Объект()
{
///
}
var Переменная = new Объект();
то оператор new устанавливает связь между Объектом и его прототипом (создаёт ссылку на прототип).
Прототипом Объекта является значение свойства prototype
функции-конструктора (все функции в JavaScript имеют свойство prototype).
Начальным значением этого свойства является ссылка на функцию-конструктор
(constructor), с которой связан прототип. Все свойства, которые вы добавляете к прототипу, автоматически становятся свойствами объектов, создаваемых с помощью конструктора.
Пример:
//Создаём конструктор
function Coord(x, y, z)
{
this.X = x;
this.Y = y;
this.Z = z;
}
//Создаём метод для прототипа
Coord.prototype.GetMul = function() {return this.X * this.Y * this.Z}
//Создаём два объекта "класса" Coord
var Point1 = new Coord(1, 2, 3);
var Point2 = new Coord(2, 3, 4);
//Вызываем методы
document.write(Point1.GetMul() + '<br>'); //6
document.write(Point2.GetMul() + '<br>'); //24
Таким образом, если вы создаёте методы или свойства для прототипа, все эти методы и свойства наследуются объектами, связанными с этим прототипом.
Эта статья - лишь краткое знакомство с ООП в JavaScript. Если хотите знать больше, то вам сюда:
>>> JavaScript, jQuery и Ajax с нуля до гуру >>>