在 JavaScript 中实现模块模式函数的最佳方法？答案

【问题标题】：Optimal way to implement a module pattern function in JavaScript?在 JavaScript 中实现模块模式函数的最佳方法？
【发布时间】：2014-07-25 14:26:24
【问题描述】：

我正在寻找实现模块功能的最佳方式，涉及内存消耗以及执行时间/步骤。

为了展示我的方法，我创建了三个示例。

我的建议如下：

1.简单的方法

function module(newId) {
  //private vars
  var settings = {
    id: newId,
    name: ''
  };
  //module object including large amount of code
  return {
    getId: function() {
      return settings.id;
    },
    getName: function() {
      return settings.name;
    },
    setName: function(newName) {
      //[...] large amount of code [...]
      settings.name = newName;
    }
  };
}

2。模块中的子函数

function module(newId) {
  //private vars
  var settings = {
    id: newId,
    name: ''
  };
  //put large amount of code here too keep it outside returned object
  function getIdFunc() {
    return settings.id;
  }
  function getNameFunc() {
    return settings.name;
  }
  function setNameFunc(newName) {
    //[...] large amount of code [...]
    settings.name = newName;
  }
  //returned module object: looks smaller - does it consume less memory?
  return {
    getId: getIdFunc,
    getName: getNameFunc,
    setName: setNameFunc
  };
}

3.模块外的子函数

//put large amount of code here too keep it outside module function
var moduleFunc = {
  getId: function(settings) {
    return settings.id;
  },
  getName: function(settings) {
    return settings.name;
  },
  setName: function(settings) {
      //[...] large amount of code [...]
    settings.name = newName;
  }
};

function module(newId) {
  var settings = {
    id: newId,
    name: ''
  };
  //returned module object: should be very small in memory
  // - but what about performance?
  return {
    getId: function() {
      moduleFunc.getId(settings);
    },
    getName: function() {
      moduleFunc.getName(settings);
    },
    setName: function() {
      moduleFunc.setName(settings);
    }
  };
}

假设创建了大量的模块并将其存储在内存中，如下所示：

//will myModules be small in memory?
var myModules = [];
for (var i = 0; i < 10000; i++) {
    myModules.push(module('test'+i));
    //does the call to setName perform well?
    myModules[myModules.length-1].setName('just a test');
}

请告诉我在性能方面更喜欢哪种创建模式，并在列举优缺点时尝试区分内存消耗和执行时间/步骤。

【问题讨论】：

在所有显示的情况下，相同的函数都可以被 js 引擎回收，因此 RAM 差异不会太大。使用原型或外部方法可能会比许多人拥有的构建速度更快。
@dandavis 做对了吗？如果 RAM 和 2 & 3 构造更快，我可以假设所有三个都相等吗？ setName() 调用的执行时间呢？是否有更多开销？
在jsperf 上运行它并查看。
使用 Function.bind(moduleFunc.setName, settings) 代替匿名可能会更快执行，也许更快初始化。如果方法使用 this （比如代替设置）来避免必须预先设置通用方法和您的实例数据之间的任何连接，那就太好了。

标签： javascript optimization module-pattern

【解决方案1】：

我创建了一个性能测试来查看结果：

http://jsperf.com/module-performance-test

1. 和 2. 几乎相等。

3.不应该用于专注于快速执行的情况。

【讨论】：