Herança JavaScript: Object.create vs new

Em JavaScript, qual é a diferença entre estes dois exemplos:

Pré-requisito:

function SomeBaseClass(){
}

SomeBaseClass.prototype = {
    doThis : function(){
    },

    doThat : function(){
    }
}

Exemplo de herança A usando Object.create:

function MyClass(){
}

MyClass.prototype = Object.create(SomeBaseClass.prototype);

Exemplo de herança B usando a nova palavra-chave

function MyClass(){
}

MyClass.prototype = new SomeBaseClass();

Ambos os exemplos parecem fazer a mesma coisa. Quando você escolheria um sobre o outro?

Uma pergunta adicional: considere o código no link abaixo (linha 15), onde uma referência ao construtor da própria função é armazenada no protótipo. Por que isso é útil?

https://github.com/mrdoob/three.js/blob/master/src/loaders/ImageLoader.js

Trecho (se você não deseja abrir o link):

THREE.ImageLoader.prototype = {

    constructor: THREE.ImageLoader
}

Na sua pergunta, você mencionou que Both examples seem to do the same thingisso não é verdade, porque

Seu primeiro exemplo

function SomeBaseClass(){...}
SomeBaseClass.prototype = {
    doThis : function(){...},
    doThat : function(){...}
}
function MyClass(){...}
MyClass.prototype = Object.create(SomeBaseClass.prototype);

Neste exemplo, você está apenas herdando, SomeBaseClass' prototypemas e se você tiver uma propriedade SomeBaseClasscomo você

function SomeBaseClass(){ 
    this.publicProperty='SomeValue'; 
}

e se você usar como

var obj=new MyClass();
console.log(obj.publicProperty); // undefined
​console.log(obj);​

O objobjeto não terá publicPropertypropriedades como neste exemplo .

Seu segundo exemplo

MyClass.prototype = new SomeBaseClass();

Ele está executando a constructorfunção, criando uma instância SomeBaseClasse herdando o SomeBaseClassobjeto inteiro . Então, se você usar

    var obj=new MyClass();
    console.log(obj.publicProperty); // SomeValue
    console.log(obj);​

Nesse caso, sua publicPropertypropriedade também está disponível para o objobjeto, como neste exemplo .

Como o Object.createnão está disponível em alguns navegadores antigos, nesse caso, você pode usar

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

O código acima apenas adiciona Object.createfunção se não estiver disponível para que você possa usar a Object.createfunção e acho que o código acima descreve o que Object.createrealmente faz. Espero que ajude de alguma forma.

Ambos os exemplos parecem fazer a mesma coisa.

Isso é verdade no seu caso.

Quando você escolheria um sobre o outro?

Quando SomeBaseClasstem um corpo de função, isso seria executado com a newpalavra - chave Isso geralmente não se destina - você só deseja configurar a cadeia de protótipos. Em alguns casos, pode até causar problemas sérios porque você realmente instancia um objeto, cujas variáveis ​​de escopo privado são compartilhadas por todas as MyClassinstâncias, pois herdam os mesmos métodos privilegiados. Outros efeitos colaterais são imagináveis.

Então, você geralmente deve preferir Object.create. No entanto, ele não é suportado em alguns navegadores herdados; é por isso que você vê a newabordagem com muita frequência, pois muitas vezes não causa danos (óbvios). Também dê uma olhada nesta resposta .

A diferença se torna óbvia se você usar Object.create()como pretendido. Na verdade, oculta completamente a prototypepalavra do seu código, ele faz o trabalho sob o capô. Usando Object.create(), podemos ir como

var base =  {
    doThis : function(){
    },

    doThat : function(){
    }
};

E então podemos estender / herdar outros objetos disso

var myObject = Object.create( base );
// myObject will now link to "base" via the prototype chain internally

Portanto, esse é outro conceito, uma maneira mais "orientada a objetos" de herdar. Não há "função construtora" pronta Object.create()para uso, por exemplo. Mas é claro que você pode apenas criar e chamar uma função de construtor autodefinida dentro desses objetos.

Um argumento para usar Object.create()é que ele pode olhar mais naturais para misturar / * herdar * de outros objetos, que usando Javascript maneira padrão .

Eu não sou especialista em java script, mas aqui está um exemplo simples para entender a diferença entre "Object.create" e "new" ..

etapa 1: crie a função pai com algumas propriedades e ações.

function Person() {

this.name = 'venkat';

this.address = 'dallas';

this.mobile='xxxxxxxxxx'

}

Person.prototype.func1 = function () {

    return this.name + this.address;
}

etapa 2: crie uma função filha (PersonSalary) que se estenda acima da função Pessoa usando Nova palavra-chave.

function PersonSalary() {
    Person.call(this);
}
PersonSalary.prototype = new Person();

PersonSalary();

etapa 3: crie a segunda função filho (PersonLeaves) que se estende acima da função Person usando a palavra-chave Object.create .

function PersonLeaves() {
 Person.call(this);
}
PersonLeaves.prototype = Object.create(Person.prototype);


PersonLeaves();

// Agora verifique os protótipos das funções filho.

PersonSalary.prototype
PersonLeaves.prototype

ambas as funções filho vincularão ao protótipo Pessoa (função pai) e poderão acessar seus métodos, mas se você criar uma função filho usando new, retornará um novo objeto com todas as propriedades pai de que não precisamos e também quando você criar qualquer objeto ou função usando "Novo" que a função pai é executada e que não queremos que seja.

Aqui estão os tópicos

se você apenas deseja delegar para alguns métodos na função pai e não deseja que um novo objeto seja criado, usar Object.create é a melhor maneira.