Dos formas de declarar métodos en Javascript

Question

Duplicar posibles:
Use of 'prototype' vs. 'this' in Javascript?

he visto tanto estas dos maneras de declarar métodos en Javascript:

var User = function() { 
    this.name = 'Foo'; 
    this.greet = function() { 
     console.log('Hello!'); 
    } 
} 

y

var User = function() { 
    this.name = 'Foo'; 
} 

User.prototype.greet = function() { 
    console.log('Hello!'); 
} 

¿Cuáles son las diferencias?

Answer 1

Si está creando una 'clase', quiere usar la segunda. Digo la clase entre comillas porque javascript no tiene la noción formal de una clase, ya que usa herencia prototípica.

Cada objeto que crea en JS hereda sus propiedades del prototipo. En el segundo ejemplo, cada Usuario que cree obtendrá el método 'Saludar' del prototipo. En su primer ejemplo, cada Usuario obtendrá el método de saludo del constructor del Usuario.

El segundo es superior porque el primer enfoque crea efectivamente una nueva copia de la función 'saludar' para cada objeto creado. En el segundo enfoque, cada objeto de usuario tiene un puntero a la función de bienvenida, por lo que el intérprete lo reutiliza. Tenga en cuenta que esto NO es lo mismo que decir que 'saludar' es estático.

Answer 2

Es posible que desee mirar a this puesto para la correcta aplicación de los "este" vs "prototipo"

Answer 3

en el primer ejemplo se crea la función del usuario, a continuación, agregar la función de saludar a ese instancia (dando User.greet()). Pero como tiene esto en la función constructora, se agregará a todas las instancias.

En el segundo ejemplo, usted define su constructor de Usuario. A continuación, defina el prototipo de saludo para todas las instancias de Usuario. Esto sale a ser lo mismo que su primer ejemplo aquí, pero si se forma de manera diferente, el cambio se vuelve más obvio

var User = function() { 
    this.name = 'Foo'; 
} 

var a=new User(); 
var b=new User(); 
a.greet=function(){ 
    alert(this.name); 
} 
/*a has the greet function, b does not*/ 

User.prototype.greet=function(){ 
    alert(this.name); 
} 
/*a and b both have the greet function now, since they are both of class User*/