JavaScript原型的解释需要

Question

在我的项目中，我通常会以字面量对象的方式创建类...

var objectName = {

     //global variables
      a : 'somevalue',

      func1: function(){

      },


      func2: function(){

      }

}

如果我需要将这个转换为原型格式，我该如何做？

使用原型的优势是什么，当使用这种格式完成工作时，与此相比有什么好处。

为什么人们会谈论原型这么多。

- John Cooper

Answer 1

转换成原型看起来会像这样：

var someObject = function() {
    this.a = "somevalue";
};

someObject.prototype.func1 = function() { // work };
someObject.prototype.func2 = function() { // work };

var myObject = new someObject();

有哪些好处呢？好处有很多，但实际上在原型比对象字面量更有意义的几个实用原因。

第一是减少重复代码；假设你想要另一个和objectName非常相似的对象，但是你想让a的值不同。你可能最终会得到这样的代码：

var objectName = {
      a : 'somevalue',
      func1: function(){ },
      func2: function(){ }
}

var otherObjectName = {
      a : 'otherValue',
      func1: function(){ },
      func2: function(){ }
}

你可以通过这样说来减少重复的函数

var objectName = {
      a : 'somevalue',
      func1: function(){ },
      func2: function(){ }
}

var otherObjectName = {
      a : 'otherValue',
      func1: objectName.func1,
      func2: objectName.func2
}

或者，使用原型（prototype）的方式，我可以在对象构造时传入想要的 a 值。重构后的代码如下所示：

var someObject = function(a) {
    this.a = a;
};

someObject.prototype.func1 = function() { /* work */ };
someObject.prototype.func2 = function() { /* work */ };

var myObject = new someObject("somevalue");
var myOtherObject = new someObject("otherValue");

现在，如果我想要给它们都添加一个新的函数。使用对象字面量方法，那么你还需要记得将该函数添加到另一个对象名中。随着字面量数量的增加，管理所有字面量将变得更加困难和耗时。

使用原型方法，我们只需这样说：

someObject.prototype.func3 = function() { // do even more work }

甚至更有趣的是，我可以通过只引用一个对象来动态地扩展两个对象。

// find what function made me, get its prototype, and add a new function to it
myObject.constructor.prototype.func3 = function() { /* work */ }
myOtherObject.func3() // tada magic!

或者我可以通过只知道引用来创建一个新对象，例如：

var newObject = myObject.constructor(myObject.a + " new");

因为myObject和myOtherObject共享相同的constructor和prototype，所以有很多有趣的事情可以通过这种关系实现，而使用对象字面量则无法实现。

你可以将原型想象成小工厂，用于创建对象，而不必自己逐个创建每个对象的字面值。

如果你认为："嗯，我只需要其中一个，并且我不会做任何疯狂的方法扩展魔术。" 那么定义对象字面量是解决某些问题的完全有效的方法。有时候使用原型更好。使用适合解决问题的模式，而不是试图将问题套入模式中。

- J. Holmes

---

那么，在构造函数中定义函数和在原型中定义函数的区别或优势是什么呢？例如：constructor.prototype.func = function() {}; - Muhammad Umer

在“var newObject = myObject.constructor(myObject.a +“ new”);”这一行中，您不需要一个“new”吗？这仍然会触发类似工厂的操作来实例化一个新对象？ - Mike