Якщо ви зробили об’єктно-орієнтоване програмування в 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_up: function() {
alert('I am awake');
},
get_age: function() {
return this.age;
}
}
Тепер ми визначили наш клас Людина. Що, якби ми хотіли визначити інший клас під назвою Manager, який успадковує деякі властивості від Person. Немає сенсу перевизначати всі ці властивості знову, коли ми визначаємо наш клас Manager, ми можемо просто встановити його для успадкування від класу Person. JavaScript не має вбудованого успадкування, але ми можемо використовувати техніку для реалізації успадкування наступним чином:
Inheritance_Manager = {};// Створюємо клас менеджера спадщини (ім'я довільне)
Тепер давайте нашому класу успадкування метод, який називається exte, який приймає аргументи baseClass та subClassas. В рамках методу extension ми створимо внутрішній клас, який називається функцією успадкування наслідування () {}. Причиною того, що ми використовуємо цей внутрішній клас, є уникнення плутанини між прототипами baseClass та subClass. Далі ми робимо прототип нашого класу успадкування вказувати на прототип baseClass, як із наступним кодом: nasledstvo.prototype = baseClass. прототип; Потім ми копіюємо прототип успадкування у прототип підкласу наступним чином: subClass.prototype = new спадкування (); Наступне - вказати конструктор для нашого підкласу наступним чином: 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.');
}
ми робимо це успадковувати від особи
Inheritance_Manager.extend(Manager, Person);
Якщо ви помітили, ми щойно викликали метод extension нашого класу 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