Herencia de JavaScript: Object.create vs new

En JavaScript, ¿cuál es la diferencia entre estos dos ejemplos?

Requisito previo:

function SomeBaseClass(){
}

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

    doThat : function(){
    }
}

Ejemplo de herencia A usando Object.create:

function MyClass(){
}

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

Ejemplo de herencia B usando la nueva palabra clave

function MyClass(){
}

MyClass.prototype = new SomeBaseClass();

Ambos ejemplos parecen hacer lo mismo. ¿Cuándo elegirías uno sobre el otro?

Una pregunta adicional: considere el código en el siguiente enlace (línea 15), donde se almacena una referencia al propio constructor de la función en el prototipo. ¿Por qué es útil esto?

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

Extracto (si no desea abrir el enlace):

THREE.ImageLoader.prototype = {

    constructor: THREE.ImageLoader
}

En su pregunta ha mencionado que Both examples seem to do the same thing, no es cierto en absoluto, porque

Tu primer ejemplo

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

En este ejemplo, solo está heredando, SomeBaseClass' prototypepero ¿qué pasa si tiene una propiedad en su SomeBaseClassgusto?

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

y si lo usas como

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

El objobjeto no tendrá publicPropertypropiedades como en este ejemplo .

Tu segundo ejemplo

MyClass.prototype = new SomeBaseClass();

Está ejecutando la constructorfunción, haciendo una instancia SomeBaseClassy heredando todo el SomeBaseClassobjeto. Entonces, si usas

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

En este caso, su publicPropertypropiedad también está disponible para el objobjeto como en este ejemplo .

Dado Object.createque no está disponible en algunos navegadores antiguos, en ese caso puede usar

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

El código anterior solo agrega Object.createfunción si no está disponible para que pueda usar la Object.createfunción y creo que el código anterior describe lo que Object.createrealmente hace. Espero que ayude de alguna manera.

Ambos ejemplos parecen hacer lo mismo.

Eso es cierto en tu caso.

¿Cuándo elegirías uno sobre el otro?

Cuando SomeBaseClasstiene un cuerpo de función, esto se ejecuta con la newpalabra clave. Esto generalmente no es intencionado: solo desea configurar la cadena de prototipos. En algunos casos, incluso podría causar problemas graves porque realmente crea una instancia de un objeto, cuyas variables de ámbito privado son compartidas por todas las MyClassinstancias ya que heredan los mismos métodos privilegiados. Otros efectos secundarios son imaginables.

Por lo tanto, generalmente debería preferir Object.create. Sin embargo, no es compatible con algunos navegadores heredados; esa es la razón por la que ve el newenfoque demasiado frecuente, ya que a menudo no hace daño (obvio). También eche un vistazo a esta respuesta .

La diferencia se vuelve obvia si se usa Object.create()como se pretende. En realidad, oculta completamente la prototypepalabra de su código, hará el trabajo bajo el capó. Usando Object.create(), podemos ir como

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

    doThat : function(){
    }
};

Y luego podemos extender / heredar otros objetos de este

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

Así que este es otro concepto, una forma de inserción más "orientada a objetos". No hay una "función de constructor" fuera de la caja usando, Object.create()por ejemplo. Pero, por supuesto, podría crear y llamar a una función constructora autodefinida dentro de esos objetos.

Un argumento para el uso Object.create()es que puede tener un aspecto más natural, a mezclar / * * heredan de otros objetos, que el uso de Javascripts manera predeterminada .

No soy un experto en Java Script, pero aquí hay un ejemplo simple para entender la diferencia entre "Object.create" y "new".

Paso 1: crea la función padre con algunas propiedades y acciones.

function Person() {

this.name = 'venkat';

this.address = 'dallas';

this.mobile='xxxxxxxxxx'

}

Person.prototype.func1 = function () {

    return this.name + this.address;
}

Paso 2: cree una función secundaria (PersonSalary) que se extienda por encima de la función Persona usando la nueva palabra clave.

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

PersonSalary();

paso 3: crea la segunda función secundaria (PersonLeaves) que se extiende por encima de la función Person usando la palabra clave Object.create ..

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


PersonLeaves();

// Ahora verifique ambos prototipos de funciones secundarias.

PersonSalary.prototype
PersonLeaves.prototype

ambas funciones secundarias se vincularán al prototipo Persona (función principal) y pueden acceder a sus métodos, pero si crea una función secundaria usando new, devolverá un objeto completamente nuevo con todas las propiedades principales que no necesitamos y también cuando cree cualquier objeto o función usando "Nuevo" que se ejecuta la función padre que no queremos ser.

Aquí están los platos para llevar

si solo desea delegar a algunos métodos en la función principal y no desea que se cree un nuevo objeto, usar Object.create es la mejor manera.