工厂函数与 Object.create - JavaScript - 何时使用哪个

Ast*_*tim 5 javascript

我已经阅读了很多有关 JavaScript 中的对象组合以及该模式相对于“类”模式的优势的内容。我已经看到了演示如何使用Object.create()创建新对象的组合示例以及演示使用返回对象的工厂函数的其他示例。

对象.创建示例:

var Component = {
  init: function() {
    // do stuff
  }
};

var button = Object.create(Component);

button.init();
Run Code Online (Sandbox Code Playgroud)

工厂函数示例:

var ComponentFactory = function() {
   return {
     init: function() {
       // do stuff
     }
  }
}

var button = ComponentFactory();

button.init();
Run Code Online (Sandbox Code Playgroud)

我知道工厂函数的目的是为了抽象出创建对象时涉及的复杂性,但是我试图了解返回对象的Object.create()函数和返回对象的函数之间是否存在任何实际差异。

Dar*_*ght 6

工厂函数创建具有自己属性的对象,Object.create创建具有指定原型的对象。

在您的示例中,创建的每个对象ComponentFactory都有自己的init(引用内存中的不同位置), Object.create(Component)创建对同一原型的引用(Component

Object.create成本更少的空间/内存,因为它不创建属性。将其用于对象的公共部分。

工厂函数更加灵活,可以创建带有初始数据的对象,以及闭包中的局部变量。将其用于对象的自定义部分。

const Component = {init() {}}
const x = Object.create(Component)
const y = Object.create(Component)

console.log(x.init === y.init) //true


function createComponent(data) {
  return {
    init() { return data }
  }
}

const p = createComponent('a')
const q = createComponent('b')
console.log(p.init === q.init) //false
console.log(p.init()) //a
console.log(q.init()) //b
Run Code Online (Sandbox Code Playgroud)