2016-04-08 14 views
6

Questa risposta è stata preceduta, ma volevo confermare la mia comprensione. In questo codice:JavaScript: Constructor vs Prototype

var somePrototype = { 
    speak: function() { 
    console.log("I was made with a prototype"); 
    } 
} 

function someConstructor() { 
    this.speak = function() { 
    console.log("I was made with a constructor"); 
    } 
} 

var obj1 = Object.create(somePrototype); 
var obj2 = new someConstructor(); 

obj1.speak(); 
obj2.speak(); 

Entrambi stanno fondamentalmente facendo la stessa cosa, giusto? L'unica differenza è che il function someConstructor() viene issato, il che significa che posso chiamare nuove istanze di esso prima che sia definito, se necessario, mentre il var somePrototype può essere chiamato solo dopo che è stato definito. Oltre a questo, non c'è differenza?

+0

Stanno facendo cose * simili *, ma sono molto distintamente diversi. – Pointy

+0

ci sono diverse (forse sottili) differenze, ma non posso fare a meno di pensare che sia stato spiegato prima ... – dandavis

+0

@dandavis sì, è stato spiegato prima :) Tuttavia, la semantica di JavaScript e dei prototipi è strana e confusa. – Pointy

risposta

4

Le differenze tra gli approcci 2 (utilizzando Object.create() e costruttore di invocazione) sono:

La creazione:

  • crea un nuovo oggetto rendendo il somePrototype è prototipo;
  • new someConstructor() crea un oggetto utilizzando la chiamata del costruttore. Il prototipo del obj2 è un semplice oggetto: new Object()

la proprietà eredità:

  • obj1 eredita la proprietà speak, che è una funzione. Se questa proprietà viene modificata nell'oggetto somePrototype, ciò influirà su tutti gli oggetti creati con che lo ereditano.
    Object.keys(obj1) restituirà [], perché l'oggetto non ha proprietà proprie.
  • obj2 contiene una proprietà speak. La modifica di questa proprietà su una singola istanza non influirà su altre istanze create utilizzando new someConstructor().
    Object.keys(obj1) restituirà ['speak'].

Il costruttore:

  • obj1.constructor === Object è true
  • obj2.constructor === someConstructor è true

sollevamento:

  • someConstructor viene issato nella parte superiore del campo di applicazione è stato creato. Quindi può essere usato prima della dichiarazione della funzione.
  • E sicuramente somePrototype non viene sollevato con il letterale dell'oggetto, quindi deve essere utilizzato dopo aver impostato il valore.

Verifica this interesting post proprietà constructor.

5

La chiamata Object.create() crea un oggetto e fornisce il prototipo richiesto. La chiamata new crea un oggetto decorato direttamente dalla funzione di costruzione.

La differenza è che l'oggetto creato dal costruttore ha una proprietà il cui valore è tale funzione con lo console.log(). La chiamata Object.create() crea un oggetto che eredita una funzione simile dall'oggetto prototipo.

Se si passava il primo oggetto a Object.keys(), non si vedrebbe la proprietà "parla"; se passassi il secondo oggetto, lo faresti.