Если вы выполнили объектно-ориентированное программирование на 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 метода в наш класс, используя его объект-прототип следующим образом:
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
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 и передали в нашем случае Менеджер подкласса, а затем BaseClass Person.Обратите внимание, что порядок очень важен здесь.Если вы поменяете их местами, наследство не будет работать так, как вы предполагали.Также обратите внимание, что вам нужно будет указать это наследование, прежде чем вы сможете определить наш подкласс.Теперь давайте определим наш подкласс:
Мы можем добавить больше методов, как показано ниже.Наш класс Manager всегда будет иметь методы и свойства, определенные в классе Person, потому что он наследуется от него.
Manager.prototype.lead = function(){
alert('I am a good leader');
}
Теперь, чтобы протестировать его, давайте создадим два объекта, один из класса Person и один из унаследованногоРуководитель класса:
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