Javascript subclassing and createElement

Question

Функция A() { this.myProp = document.createElement ("div"); }

function B(id) { 
    this.myProp.id = id; 
    document.body.appendChild(this.myProp); } 

B.prototype = new A(); 

window.onload = function() { 
    new B("hello"); 
    new B("goodbye"); } 

Что происходит, здесь я получаю один div с id «до свидания». Я бы хотел, чтобы два div с указанными идентификаторами.

Я смог исправить эту проблему, создав метод «A», который создает элемент.

Как я могу исправить это, не используя метод?

Answer 1

Вы должны вызвать конструктор A() при создании new B():

function A() { 
    this.myProp = document.createElement("div"); 
} 

function B(id) { 
    A.call(this); // !!! 
    this.myProp.id = id; 
    document.body.appendChild(this.myProp); 
} 

Если вы хотите B экземпляров наследовать от A.prototype, не устанавливайте B.prototype к A например, но использовать Object.create() - или обычая реализация для устаревших браузеров - во избежание вызова конструктора:

var clone = Object.create || (function() { 
    function Dummy() {} 
    return function(obj) { 
     Dummy.prototype = obj; 
     return new Dummy; 
    }; 
})(); 

B.prototype = clone(A.prototype);