javascript - 将函数传递给自执行函数的原因

Question

我从一家设计公司拿到了js代码，但我不明白为什么要将一个函数传递给一个自执行函数。

这是代码的概要。

(function(core) {
   if (typeof define === "function" && define.amd) {
       define("abc", function() {
           var abc;
           abc = window.Abc || core(window, window.jQuery, window.document);
           abc.load = function(res, req, onload, config) {
               var base, i, load, resource, resources;
               resources = res.split(",");
               load = [];
               base = (config.config && config.config.abc && config.config.abc.base ? config.config.abc.base : "").replace(/\/+$/g, "");
               if (!base) {
                   throw new Error("Please define base path to Abc in the requirejs config.");
               }
               i = 0;
               while (i < resources.length) {
                   resource = resources[i].replace(/\./g, "/");
                   load.push(base + "/components/" + resource);
                   i += 1;
               }
               req(load, function() {
                   onload(abc);
               });
           };
           return abc;
       });
   }
   if (!window.jQuery) {
       throw new Error("Abc requires jQuery");
   }
   if (window && window.jQuery) {
       core(window, window.jQuery, window.document);
   }
})(function(global, $, doc) {
   var _c = {};
   ...
   return _c;
});

以这种方式编写代码比下面的代码有好处吗？

(function( core, $, undefined) { 
   ... 
} (window.core= window.core|| {}, jQuery )};  

Answer 1

Is this some advanced technique?

基本上，....有点。

在 Javascript 中，函数被视为一等对象。这意味着您可以将它们传递给变量等等。第一部分 (function(core) { ... }) 创建一个匿名函数，采用名为 core 的单个参数。函数周围的括号基本上只是解析为 function。第二部分 (function(global, $, doc) { ... }) 正在创建另一个函数，该函数作为 的值立即传递给对第一个函数的调用核心。

这样说，这就是正在发生的事情。

// Define the first function (the one that takes core)
var firstFunc = function (core) { /* ... */ };

// Define the second function (the one that takes global, $, and doc)
var secondFunc = function (global, $, doc) { 
    var _c = {};
    /* ... */ 
    return _c;
};

// Call the first, passing in the second.
firstFunc(secondFunc);

上面的代码和您发布的代码完成了同样的事情。编写这样的东西的一个目的是将第二个函数沙盒化，以便第一个函数可以指定其自己的本地版本的变量 global、$ 和 doc，这避免了与 jQuery 的主动运行版本(通常声明其自己的全局范围的 $ 变量)发生冲突。

编辑:现在第一个函数中的代码已经填写完毕，我们可以肯定地说，这样做的原因是为了解决依赖关系并确保它们存在，然后再手动将它们传递给第二个功能。从提供的代码来看，这似乎是通过 require.js 强制存在 abc(我假设它是某种依赖项)。 ，以及确保 jQuery 存在。此外，看起来从函数返回的 _c 中的值被用作该依赖项执行过程的一部分，尽管我无法通过查看它来确切地说出是如何发生的。