Question

前一段时间我正在研究一个教程，在该教程中，作者使用以下方法编写可重用代码。我试图找到该教程，但还没有结果。我想了解一下下面的方法，如何在不将模块添加到全局命名空间的情况下将其重用于new运算符？

(function(factory) {

})(function() {
    // All of the logic code was here in that tutorial.
});

Answer 1

我认为你应该查看模块模式，该模式旨在创建可重用的良好封装的javascript组件

这是一个简短的例子

 MyModule = function(){
      var privateAttribute = 2;
      return {
         publicAttribute : "this is a public attribute";
         publichMethod : function (param1){console.log(param1);}
      }

 }();

var module = MyModule;
module.putlicMethod("hello world");

Answer 2

所以，我们的想法是第二个函数是你在第一个函数中作为factory参数传递的函数，因此你将创建factory的实例并在这些实例中编写代码。 TOP 功能 - 不是底层功能。底部函数是您的模块定义。

感谢@Bergi让我开始走上正轨。

以下是代码示例：

＆＃13;

(function(factory) {
  var constructor = new factory();
  var obj1 = new constructor();
  var obj2 = new constructor();
  console.log("obj1: ", obj1);
  console.log("obj2: ", obj2);
})(function() {
  return function() {
    return {
      prop1: "123",
      prop2: "ABC"
    }
  }
});

＆＃13;

Answer 3

从您的代码示例中很难确切知道您要查找的内容，但代码看起来类似于用于定义可重用模块的通用模块定义模式（UMD），以便与各种模块加载器一起使用。

UMD（taken from this page）的一个示例，它说明了您在代码中描述的内容 - 下层函数中的实际代码逻辑（模块），它作为参数factory传递给上层处理模块设置的功能：

(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(['jquery'], factory);
    } else if (typeof exports === 'object') {
        // Node, CommonJS-like
        module.exports = factory(require('jquery'));
    } else {
        // Browser globals (root is window)
        root.returnExports = factory(root.jQuery);
    }
}(this, function ($) {
    //    methods
    function myFunc(){};

    //    exposed public method
    return myFunc;
}));

我想知道这种在javascript中编写可重用代码的方法

3 个答案: