Если вы выполнили объектно-ориентированное программирование на JavaScript, вы будете знать, что вы можете создать класс следующим образом:
Person = function(id, name, age){
this.id = id;
this.name = name;
this.age = age;
alert('A new person has been accepted');
}
Пока у нашего ученика есть только два свойства, и мы собираемся дать ему несколько методов. Чистый способ сделать это
использовать его объект-прототип.
Начиная с JavaScript 1.1, объект-прототип был представлен в JavaScript. Это встроенный объект, который
упрощает процесс добавления пользовательских свойств и методов ко всем экземплярам объекта.
Давайте добавим 2 метода в наш класс, используя его объект 'prototype' следующим образом:
Person.prototype = {
/** wake person up */
wake_up: function() {
alert('I am awake');
},
/** retrieve person's age */
get_age: function() {
return this.age;
}
}
Теперь мы определили наш класс Person. Что, если мы хотим определить другой класс с именем Manager, который наследует некоторые свойства от Person. Нет смысла переопределять все эти свойства снова, когда мы определяем наш класс Manager, мы можем просто установить его наследование от класса Person.
JavaScript не имеет встроенного наследования, но мы можем использовать технику для реализации наследования следующим образом:
Inheritance_Manager = {}; // Создаем класс диспетчера наследования (имя произвольное)
Теперь давайте передадим нашему классу наследования метод под названием extend, который принимает аргументы baseClass и subClassas.
В рамках метода extends мы создадим внутренний класс под названием унаследованная функция inheritance () {}. Причина, почему мы используем этот внутренний
Класс должен избежать путаницы между прототипами baseClass и subClass.
Далее мы делаем прототип нашего класса наследования указав на прототип baseClass, как показано в следующем коде:
inheritance.prototype = baseClass. прототип;
Затем мы копируем прототип наследования в прототип subClass следующим образом: subClass.prototype = new inheritance ();
Далее нужно указать конструктор для нашего подкласса следующим образом: subClass.prototype.constructor = subClass;
Закончив прототипирование нашего подкласса, мы можем указать следующие две строки кода, чтобы установить некоторые указатели базового класса.
subClass.baseConstructor = baseClass;
subClass.superClass = baseClass.prototype;
Вот полный код нашей функции расширения:
Inheritance_Manager.extend = function(subClass, baseClass) {
function inheritance() { }
inheritance.prototype = baseClass.prototype;
subClass.prototype = new inheritance();
subClass.prototype.constructor = subClass;
subClass.baseConstructor = baseClass;
subClass.superClass = baseClass.prototype;
}
Теперь, когда мы реализовали наше наследование, мы можем начать использовать его для расширения наших классов. В этом случае мы собираемся
расширить наш класс Person в класс Manager следующим образом:
Определяем класс менеджера
Manager = function(id, name, age, salary) {
Person.baseConstructor.call(this, id, name, age);
this.salary = salary;
alert('A manager has been registered.');
}
мы заставляем его наследовать форму Person
Inheritance_Manager.extend(Manager, Person);
Если вы заметили, мы только что вызвали метод extends нашего класса Inheritance_Manager и передали в нашем случае диспетчер подкласса, а затем базовый класс. Обратите внимание, что порядок очень важен здесь. Если вы поменяете их, наследство
не будет работать, как вы предполагали, если вообще.
Также обратите внимание, что вам нужно будет указать это наследование, прежде чем вы сможете определить наш подкласс.
Теперь давайте определим наш подкласс:
Мы можем добавить больше методов, как показано ниже. Наш класс Manager всегда будет иметь методы и свойства, определенные в классе Person, потому что он наследуется от него.
Manager.prototype.lead = function(){
alert('I am a good leader');
}
Теперь, чтобы проверить это, давайте создадим два объекта, один из класса Person и один из унаследованного класса Manager:
var p = new Person(1, 'Joe Tester', 26);
var pm = new Manager(1, 'Joe Tester', 26, '20.000');
Не стесняйтесь, чтобы получить полный код и больше комментариев на:
http://www.cyberminds.co.uk/blog/articles/how-to-implement-javascript-inheritance.aspx