我从设计公司获得了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 )};
答案 0 :(得分:1)
这是一种先进技术吗?
基本上......有点。
在Javascript中,函数被视为第一类对象。这意味着你可以在变量和诸如此类的东西中传递它们。第一部分(function(core) { ... })
创建一个匿名函数,使用一个名为core
的参数。函数周围的括号基本上只解析为function
。第二部分(function(global, $, doc) { ... })
正在创建另一个函数,该函数立即传递给第一个函数的调用,作为core
的值。
这样,这就是发生的事情。
// 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
中的值被用作该依赖项强制执行过程的一部分,但我无法通过查看它来确切地说明它是什么。