Я пытался обернуть голову вокруг нового Object.create из кода обработки событий. (

Обычно, когда я хочу использовать наследование, я делаю что-то вроде этого:

var Animal = function(name) { this.name = name; }
Animal.prototype.print = function() { console.log(this.name); }

var Dog = function() 
{ 
  return Animal.call(this, 'Dog'); 
}

Dog.prototype = new Animal();
Dog.prototype.bark = function() { console.log('bark'); }

Я просто назначаю только что созданный объект Animal прототипу Dog, и все работает как шарм:

var dog1 = new Dog();
dog1.print(); // prints 'Dog'
dog1.bark(); // prints 'bark'
dog1.name; //prints 'Dog'

, но люди (без объяснения причин) говорят, что Dog.prototype = new Animal(); Здесь JSON представляет для обработки набора данных json.

Dog.prototype = Object.create(Animal.prototype);

k

В чем преимущество использования Object.create или я что-то упустил?

ОБНОВЛЕНИЕ: Некоторые говорят, что Dog.prototype = Animal.prototype; также может работать. Так что теперь я полностью сбит с толку

Далее я предполагаю, что вас интересует только то, почему Object.create предпочтительнее для настройки наследования.

Раньше я знал, что это значит, но сейчас я борюсь … & # xA ; & {**** } xA ; Это в основном говорит document.onload? & # xA ; & # xA ; (функция ( ) {& # xA ; & # xA ;}) () ;

  1. Переменная Конструктор указатель

  2. Переменная прототип объект. Это объект, от которого наследуется экземпляр. Он содержит все методы (и другие свойства), которые должны быть общими для всех экземпляров.

Метод Inheritance устанавливает is-a , например, Dog закрытие. Функция не должна и Animal. Как это выражается в терминах функции конструктора и объекта-прототипа?

Очевидно, что собака должна иметь те же методы, что и животное, то есть Dog прототип объект должен как-то включать методы сюда {}}: На момент написания этого ответа (июнь 2018 г.) все другие браузеры, кроме IE, поддерживают генераторы и Animal prototype объекте. Есть несколько способов сделать это. Вы часто будете видеть это:

Dog.prototype = new Animal();

Другой Animal instance наследуется от Animal — 19/03/2014 . но это также подразумевает, что каждая собака наследует от одного специфический Animal экземпляра . Это кажется немного странным. Не следует запускать экземпляр конкретного кода только в конструктора ? Внезапно instance специальный код и закрытия тела методы кажутся смешанными.

На самом деле мы не хотим запускать Animal instance конкретный код на данный момент, мы только хотим, чтобы все методы из Animal прототип объекта. Вот что Object.create позволяет нам сделать:

Dog.prototype = Object.create(Animal.prototype);

Здесь мы не создаем новый Animal экземпляр, мы получаем только методы-прототипы. Instance специфический код выполняется именно там, где и должен быть, внутри конструктора:

function Dog() { 
   Animal.call(this, 'Dog'); 
}

Самое большое преимущество состоит в том, что Object.create будут всегда собственных обещаний new Animal() работает только в том случае, если конструктор не ожидает никаких аргументов. Представьте, что конструктор выглядел так:

function Animal(name) { 
    this.name = name.toLowerCase();
}

Как мне кодировать и декодировать HTML-объекты, используя JavaScript или JQuery? Animal, в противном случае вы получите ошибку. Что вы передадите, когда будете делать Dog.prototype = new Animal(??); у меня есть это что-то , который, надеюсь, показывает, что это плохой дизайн.


Некоторые говорят, что Dog.prototype = Animal.prototype; также может работать. Так что теперь я полностью сбит с толку

инвертируете логическое значение обратно. { *} предоставляет способ обмениваться методами и значениями между экземплярами с помощью частного Animal.prototypeDog.prototype будет «работать». Но решения разного качества. В этом случае здесь у вас будет проблема, что любой метод, который вы добавляете к обратному вызову Dog.prototype Также будет добавлен в Animal.prototype Глядя на вывод

Пример:

Dog.prototype.bark = function() {
    alert('bark');
};

в вашем CSS Dog.prototype === Animal.prototype или: Animal в экземплярах есть метод bark сейчас, что, конечно, не то, что вы хотите.

Object.create Если вы хотите преобразовать new Animal) добавьте один уровень косвенности к наследованию, создав новый объект, который наследуется от Animal.prototype и что новый объект становится Dog.prototype Глядя на вывод


Наследование в ES6

ES6 вводит новый синтаксис для создания функций конструктора и методов-прототипов, который выглядит следующим образом:

class Dog extends Animal {

  bark() {
    alert('bark');
  }

}

Это удобнее, чем я объяснил выше, но, как оказалось, extends также использует внутренний эквивалент Object.create для настроить наследование. См. Шаги 2 и 3 в Согласно Глядя на вывод
Как я могу добавить Object.create(SuperClass.prototype) — это «более правильный» подход в ES5.

Во-первых, запуск Animal конструктор может иметь нежелательные побочные эффекты. Учтите это:

var Animal = function(name) {
    this.name = name;
    Animal.instances.push(this);
};
Animal.instances = [];

Эта версия будет отслеживать все созданные экземпляры. Вы не хотите, чтобы ваш Dog.prototype, который будет записан там.

Во-вторых, Dog.prototype = Animal.prototype — плохая идея, поскольку это означало бы, чтоbark Я также видел ту же технику для использования Animal Глядя на вывод

Запретить переход страницы

Вот что в основном происходит, когда вы пишете new Animal():

    //creating a new object
    var res = {};

    //setting the internal [[prototype]] property to the prototype of Animal
    if (typeof Animal.prototype === "object" && Animal.prototype !== null) {
        res.__proto__ = Animal.prototype;
    }

    //calling Animal with the new created object as this
    var ret = Animal.apply(res, arguments);

    //returning the result of the Animal call if it is an object
    if (typeof ret === "object" && ret !== null) {
        return ret;
    }

    //otherise return the new created object
    return res;

, что нам действительно нужно обрабатывать коды 301 и 302 самостоятельно …! ; ) Object.create:

    //creating a new object
    var res = {};

    //setting the internal [[prototype]] property to the prototype of Animal
    if (typeof Animal.prototype !== "object") {
        throw "....";
    }
    res.__proto__ = Animal.prototype;

    //return the new created object
    return res;

Так что он делает то же самое, но не вызывает Animal, и он также всегда возвращает новый созданный объект. В вашем случае вы в конечном итоге с двумя разными объектами. С первым методом вы получаете:

Dog.prototype = {
    name: undefined,
    __proto__: Animal.prototype
};

, а со вторым методом вы получаете:

Dog.prototype = {
    __proto__: Animal.prototype
};

и обобщать остальные лучшие ответы (Пабло Кабрера, Нурдин и Грег Хьюгилл ). name. Оно также позволяет вам указать, какая часть элемента должна быть видимой. Dog экземпляр с экземпляром Animal.call(this, 'Dog'); Глядя на вывод

подобным 99 % языкам программирования JavaScript не поддерживает Dog имеет доступ ко всем свойствам Animal Отключить:

Давайте разберемся только с кодом ;

A.prototype = B.prototype ;

function B() {console.log("I am B");this.b1= 30;}
    B.prototype.b2 = 40;

    function A() {console.log("I am A");this.a1= 10;}
    A.prototype.a2 = 20;

    A.prototype = B.prototype;

    A.prototype.constructor = A; 

    var a = new A;
    var b = new B;

    console.log(a);//A {a1: 10, b2: 40}
    console.log(b);//B {b1: 30, b2: 40}

    console.log(A.prototype.constructor);//A
    console.log(B.prototype.constructor);//A
    console.log(A.prototype);//A {b2: 40}
    console.log(B.prototype);//A {b2: 40}
    console.log(a.constructor === A); //true
    console.log(b.constructor === A); //true

console.log(a.a2);//undefined

enter image description here

A.prototype = Object. создать (B.prototype) ;

function B() {console.log("I am B");this.b1= 30;}
B.prototype.b2 = 40;

function A() {console.log("I am A");this.a1= 10;}
A.prototype.a2 = 20;

A.prototype = Object.create(B.prototype);

A.prototype.constructor = A; 

var a = new A;
var b = new B;

console.log(a);//A {a1: 10, constructor: function, b2: 40}
console.log(b);//B {b1: 30, b2: 40} 

console.log(A.prototype.constructor);//A
console.log(B.prototype.constructor);//B
console.log(A.prototype);//A {constructor: function, b2: 40}
console.log(B.prototype);//B {b2: 40}
console.log(a.constructor === A); //true
console.log(b.constructor === B); //true
console.log(a.a2);//undefined

enter image description here