Jak naśladować konstruktor za pomocą komponentu ES5 Object.create i literału obiektowego?

Question

przypuszczać mam obiektu takiego:

var Foo = { 
    x: 5, 
    sprite: new Image() 
} 

Problem: Chcę zainicjować tej ikonki z prawej src. Jednak kiedy używam następujące techniki utworzenia:

var f = Object.create(Foo); 

nie mam konstruktora (funkcja aka startowych) w konfiguracji sprite.src = 'cool.png';

Moje pytanie:

Jeśli używam obiektu dosłowne technika i Object.create(), kiedy mogę faktycznie zainicjować niektóre z mojego stanu wewnętrznego (jak na przykładzie new Image())

Moje rozwiązanie:

Jednak nie wiem, czy to świetny wzór. Chciałbym zrobić to "JavaScript Way", jeśli jest jakiś sposób. :)

Dzięki!

Answer 1

Aby wyciąć długie opowiadanie: Nie próbować. Podstawową ideą Object.create jest unikanie funkcji konstruktora. Jesteś lepiej wyłączyć za pomocą tego dobrego starego wzoru:

var Foo = function (url) { 
    //this.sprite.src = url; // This will overwrite the prototype's src 
    this.sprite = new Image(); 
    this.sprite.src = url; 
}; 
Foo.prototype = { 
    x: 5, 
    sprite: new Image() // do you really want this? 
}; 

Następnie użyj new Foo zamiast Object.create.

Answer 2

bym po prostu to zrobić:

function Image(src) { 
    this.src = src; 
} 

function Foo() { 
    this.x = 5; 
    this.sprite = new Image('cool.png'); 
} 

Answer 3

Jak mogę założyć, z tego link należy zrobić coś takiego:

function ImgInstance(src){ 
    var img=new Image(); 
    img.src=src; 
    return img; 
} 

Object.create(Foo, {sprite: {value: ImgInstance("url")}}); 

Answer 4

zrobić coś bardzo podobnego do tego, co napisałem powyżej, ale łączą je ze wzoru modułu:

var Vehicle = (function(){ 
     var exports = {}; 
     exports.prototype = {}; 
     exports.prototype.init = function() { 
       this.mph = 5; 
     }; 
     exports.prototype.go = function() { 
       console.log("Going " + this.mph.toString() + " mph."); 
     }; 

     exports.create = function() { 
       var ret = Object.create(exports.prototype); 
       ret.init(); 
       return ret; 
     }; 

     return exports; 
})(); 

Z zewnątrz, ten naraża Vehicle.create() i Vehicle.prototype. Następnie, jeśli chcę, aby pochodnym typu, mogę to zrobić:

var Car = (function() { 
     var exports = {}; 
     exports.prototype = Object.create(Vehicle.prototype); 
     exports.prototype.init = function() { 
       Vehicle.prototype.init.apply(this, arguments); 
       this.wheels = 4; 
     }; 

     exports.create = function() { 
       var ret = Object.create(exports.prototype); 
       ret.init(); 
       return ret; 
     }; 

     return exports; 

})(); 

Ten wzór pozwala mi czerpać typów bez dokonywania błąd Car.prototype = new Vehicle(), który jest nie jeśli moi konstruktorzy wziąć parametry.

Answer 5

Myślę, że ten artykuł podsumowuje to całkiem ładnie:

http://www.bennadel.com/blog/2184-Object-create-Improves-Constructor-Based-Inheritance-In-Javascript-It-Doesn-t-Replace-It.htm