在JS中用原型包装我的大脑

Question

我一直在尝试理解JS中的原型概念，但出于某种原因，我发现它真的令人费解。为什么要使用原型?什么时候使用原型？

这(来自这个MDN example)有什么区别：

function Person(gender) {
  this.gender = gender;
}

Person.prototype.sayHello = function()
{
  alert ('hello');
};

还有这个：

function Person(gender) {
  this.gender = gender;

  this.sayHello = function() {
    alert('hello');
  };
}

我想我知道如何使用它们，但我不知道我为什么要使用它们。也许我错过了什么--算了吧--很明显我错过了什么！

谁能解释一下这两个示例之间的区别，以及为什么我应该使用一个而不是另一个？

谢谢!

Answer 1

Prototype对于继承很重要。如果你不需要继承，那么真的没有区别。但是，请考虑以下内容：

function Person(gender) {
 this.gender = gender;

 this.sayHello = function() {
  alert('hello');
 };
}

function User(){

}

User怎么可能是Person呢？这里真的没有简单的方法。但是，使用prototype可以做到这一点：

function Person(name) {
 this.name = name;
}

Person.prototype.sayHello = function() {
  alert(this.name);
 };

function User(name){
 this.constructor(name);
}

User.prototype = new Person();

var u = new User("joe");
u.sayHello();//alerts joe

现在，我们可以更进一步，在使用prototype时覆盖用户问候的功能，如下所示：

User.prototype.sayHello = function(){ 
 alert("Username: " + this.name);
}

Answer 2

在使用原型示例创建new Person()时，它不会使用person对象将sayHello()加载到内存中。

相反，一旦需要/调用它，它就会将它添加到对象中，并且只在需要/调用时加载一次。

当处理大量对象时，这可以为用户节省大量内存。

Answer 3

类和继承。与其自己花一两个小时来解释它，我强烈建议我先跳过这个小tutorial.，跳到关于原型的部分，它以一种有趣的方式很好地解释了它。