在Javascript中声明方法的两种方式[重复]答案

【问题标题】：Two ways of declaring methods in Javascript [duplicate]在Javascript中声明方法的两种方式[重复]
【发布时间】：2011-05-06 02:52:37
【问题描述】：

可能重复：
Use of 'prototype' vs. 'this' in Javascript?

我见过这两种在 Javascript 中声明方法的方式：

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

和

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

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

有什么区别？

【问题讨论】：

相关：stackoverflow.com/questions/1635116/…

标签： javascript

【解决方案1】：

如果你正在创建一个“类”，你想使用第二个。我用引号说类是因为 javascript 没有类的正式概念，因为它使用原型继承。

您在 JS 中创建的每个对象都从原型继承其属性。在第二个示例中，您创建的每个用户都会从原型中获得方法“greet”。在您的第一个示例中，每个 User 都会从 User 构造函数中获取方法 greet。

第二种方法更好，因为第一种方法有效地为每个创建的对象创建了“greet”函数的新副本。在第二种方法中，每个 User 对象都有一个指向 greet 函数的指针，因此它实际上被解释器重用。请注意，这与说“问候”是静态的不同。

【讨论】：

【解决方案2】：

在第一个示例中，您创建了 User 函数，然后将 greet 函数添加到该实例（提供 User.greet()）。但既然你在构造函数中有这个，那么它将被添加到所有实例中。

在第二个示例中，您定义了 User 构造函数。然后为 User 的所有个实例定义问候原型。这与您在这里的第一个示例结果相同，但如果形成不同，则变化会变得更加明显

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*/

【讨论】：