javascript - Javascript中构造对象的两种方式

Question

function Person(age,name){
    this.name = name;
    this.age  = age;
    this.speak = function(){...}
}

function Person(age,name){
    var p = {}
    p.name = name;
    p.age = age;
    p.speak = function(){...}
    return p;
}

我看到的唯一区别是，使用第一个你必须用 new 调用来让语言知道它正在构造一个新对象，它本质上只是构造一个对象，其中“this”指的是正在创建的新对象吗？

即与这样做相同。

{
   age: 12,
   name: "mark",
   speak: function(){...}
}

第二个返回一个对象，所以你可以写

Person(12,"mark")

代替

new Person(12,"mark")

所以我想我的问题是，使用第二个版本有什么问题吗？我所说的差异是否正确？它们是两者之间唯一的差异吗？

Answer 1

第一个:

function Person(age,name){
    this.name = name;
    this.age  = age;
    this.speak = function(){...}
}

1. 是一个命名的构造函数。
2. 将与 instanceof Person 一起正常工作
3. 使用 mixin 或经典的 Javascript 继承更容易
4. 如果有很多方法，可以将原型(prototype)用于可能消耗更少内存或更快构造对象的方法
5. 也可以设计为无需 new 即可工作。
6. 更类似于新的 ES6 class 和 extends 语法的工作方式，这很可能是 future 编写大量 Javascript 的方式。

---

第二个:

function Person(age,name){
    var p = {}
    p.name = name;
    p.age = age;
    p.speak = function(){...}
    return p;
}

1. 是一个工厂函数。它创建一个通用对象，为其分配属性，然后返回该对象。
2. 它可以从另一个知道该对象如何工作的工厂函数继承，但不能以经典方式继承。某些类型的 mixin 继承不适用于此结构。
3. 不适用于 instanceof。
4. 不会也不能将原型(prototype)用于方法。
5. 可以用 new 调用并且仍然有效(系统创建的新对象将被丢弃)。
6. 可以创建任何类型的对象。它甚至可以根据传递的参数或环境进行分支，并根据某些逻辑创建不同类型的对象。从技术上讲，您也可以使用第一种样式来执行此操作，但效率很低，因为解释器会创建特定类型的对象，然后您将返回其他内容，导致创建的原始对象随后被垃圾回收。因此，如果您要创建多种不同类型的对象，第二种方法会更有效。

除了这些差异之外，两者的功能基本相同，并且这两种方法在技术上都没有任何“错误”。

Javascript 中的两种编程风格都有拥护者，有些人会说有些情况下一种比另一种更合适，反之亦然。我建议您为此对象构建几个子类以消除更多编程差异，因为子类的工作方式也不同。

---

如果您想搜索有关该主题的其他文章，这基本上是一篇“构造函数与 Javascript 中的工厂函数”的文章，有时会误入支持/反对使用 .prototype，但也往往涵盖您的主题。

以下是关于该特定主题的一些文章(涵盖了各种观点):

JavaScript Constructor Functions Vs Factory Functions

Javascript object creation patterns

In defense of JavaScript’s constructors

Constructor function vs Factory functions

Factory constructor pattern

Some Useful JavaScript Object Creation Patterns

Constructors Are Bad For JavaScript

Constructors vs factories