Выполнение наследования в JavaScript

Ответ 1

Ориентированная на объект JavaScript парадигма основана на прототипе. Нет "классов", просто объектов.

Вы можете реализовать наследование по-разному. Двумя более популярными альтернативами являются "псевдоклассические" и "прототипные" формы. Например:

Псевдоклассическое наследование

Я думаю, что это самый популярный способ. Вы создаете функции конструктора, которые вы используете с new оператора, и вы добавляете элементы через прототип функции конструктора.

// Define the Person constructor function
function Person() {}

Person.prototype.sayHello = function(){
    alert ('hello');
};

// Define the Student constructor function
function Student() {}

// Inherit from Person
Student.prototype = new Person();

// Correct the constructor pointer, because it points to Person
Student.prototype.constructor = Student;

// Replace the sayHello method (a polymorphism example)
Student.prototype.sayHello = function () {
    alert('hi, I am a student');
}

var student1 = new Student();
student1.sayHello();

Прототипное наследование

В основном мы создаем вспомогательную функцию, которая принимает объект как параметр и возвращает пустой новый объект, который наследуется от старого, объекты наследуются от объектов.

// Helper function
if (typeof Object.create !== 'function') {
    Object.create = function (o) {
        function F() {}
        F.prototype = o;
        return new F();
    };
}

var person = {
    sayHello : function () {
        alert('Person object');
    },
    walk : function () {
        alert('walk');
    }
};

var student1 = Object.create(person);
student1.sayHello = function () {
    alert('hello I am a student');
};

Еще одна интересная форма - это паразитическое наследование. В "производном" конструкторе вы создаете экземпляр объекта "base". Этот объект добавляется и возвращается новый экземпляр:

// Person constructor function
function Person(name) {
    this.name = name;
}

function Student(value) {
    var that = new Person(value);
    that.sayHello = function () {
        alert('hello I am a student');
    };
    return that;
}

Ответ 2

Наследование JavaScript выполняется через прототипы. Вы не определяете ничего с ключевым словом class, но вы создаете функцию, которая используется как конструктор для создания новых объектов (с ключевым словом new).

function person(name) {
    this.name = name;
}

person.prototype.getName = function() {
    return this.name;
}

var john = new person('john');
alert( john.getName() );

Вы можете получить доступ к этому прототипному методу с помощью:

person.prototype.getName

Все вновь созданные объекты строятся на основе основных конструкторов (иногда называемых классами людей, принадлежащих классическим языкам наследования, или основных объектов), таких как Object, поэтому каждый объект в JavaScript имеет доступ к Object.prototype. Если вы хотите создать собственный метод для всех объектов, которые вы бы сделали:

Object.prototype.foo = function(){};
alert( typeof ({}).foo ) // 'function'

Ключевые примечания:

• Слово this используется для обозначения текущего объекта, поэтому this.name устанавливает свойство имени объекта, создаваемого при вызове new person.
• Вы можете определить новые прототипные методы для конструктора с помощью constructorName.prototype.nameOfMethod = function(){} после определения конструктора. Вам не нужно определять его внутри конструктора, и он более эффективен таким образом.
• Если вы явно не определяете свойства объекта, поэтому с созданным мной объектом john, поскольку метод getName, непосредственно прикрепленный к объекту john, отсутствует, интерпретатору необходимо пройти до прототипа john, который является person.prototype и доступ к этому методу оттуда. Вы можете использовать hasOwnProperty, чтобы узнать, обладает ли объект непосредственно собственностью или нет.

Ссылка:

• Наследование повторно
• Классическое наследование в JavaScript

Ответ 3

Если вы сделали объектно-ориентированное программирование в JavaScript, вы узнаете, что вы можете создать класс следующим образом:

Person = function(id, name, age){
    this.id = id;
    this.name = name;
    this.age = age;
    alert('A new person has been accepted');
}

До сих пор у нашего класса только два свойства, и мы собираемся дать ему некоторые методы. Чистый способ сделать это для использования его объекта 'prototype'. Начиная с JavaScript 1.1, объект-прототип был введен в JavaScript. Это встроенный объект, который упрощает процесс добавления пользовательских свойств и методов ко всем экземплярам объекта. Давайте добавим 2 метода к нашему классу, используя его объект 'prototype' следующим образом:

Person.prototype = {
    /** wake person up */
    wake_up: function() {
        alert('I am awake');
    },

    /** retrieve person age */
    get_age: function() {
        return this.age;
    }
}

Теперь мы определили наш класс Person. Что делать, если мы хотим определить другой класс под названием "Менеджер", который наследует некоторые свойства от Person. Нет смысла переопределять все эти свойства снова, когда мы определяем наш класс Manager, мы можем просто установить его наследование из класса Person. JavaScript не имеет встроенного наследования, но мы можем использовать метод для реализации наследования следующим образом:

Inheritance_Manager = {};//Создаем класс менеджера наследования (имя произвольно)

Теперь дадим нашему классу наследования метод, называемый extend, который принимает аргументы baseClass и subClassas. В рамках метода extend мы создадим внутренний класс, называемый функцией наследования 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);

Если вы заметили, мы только что назвали метод расширения нашего класса Inheritance_Manager и передали в этом случае диспетчер subClass, а затем - имя baseClass. Обратите внимание, что порядок здесь очень важен. Если вы меняете их, наследование не будет работать так, как вы планировали, если вообще. Также обратите внимание, что вам нужно будет указать это наследование, прежде чем вы сможете определить наш субкласс. Теперь определим наш подкласс:

Мы можем добавить несколько методов, как показано ниже. Наш класс 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

Ответ 4

JavaScript - это прототип, основанный на наследовании. Однако, если вы используете Ext-js, это позволит вам иметь синтаксис более классического синтаксиса наследования. Будьте предупреждены, что он еще прототипирует под капотом, так что будут некоторые нюансы, о которых вы должны знать. В основном, это загрузка и переход, поэтому порядок загрузки ваших script имеет значение, и определения вашего класса по существу хранятся в памяти.

Есть несколько хороших tutorials. Я предлагаю просмотреть начальные документы и посмотреть видео . Ext делает довольно хорошую работу, чтобы сделать JavaScript более похожим на Java или С# и уменьшить количество разметки, которую вы пишете. Однако компромисс заключается в том, что у вас есть более высокая кривая обучения для настройки компонентов. После того, как вы получите более четкое представление о языке, вы сможете использовать mixins, функции лучше, чтобы уменьшить потребность в наследовании.

Ответ 5

Вы можете попробовать

subClass.prototype.__proto__ = baseClass.prototype;

Подробнее см. мой сайт.

Ответ 6

Вот простой пример наследования. ClassA является родителем, а ClassB является дочерней, а общая задача - вызов метода печати класса Class через класс B, поэтому здесь первый инициализированный конструктор создает метод прототипа для родительского класса.

var ClassA = function() {
this.name = "class A";
 }
var a = new ClassA();
ClassA.prototype.print = function() {
alert(this.name);
}

var inheritsFrom = function (child, parent) {
 child.prototype = Object.create(parent.prototype);
 };
var ClassB = function() {
     this.name = "class B";
     this.surname = "I'm the child";
 }

 inheritsFrom(ClassB, ClassA);
 var b = new ClassB();
 b.print();