Question

以下是JavaScript中的常见做法：

(function($) {
    ...code...
})(jQuery);

我理解包装函数（它可以防止污染全局命名空间），但许多库（如jQuery，Underscore等）已经分别定义了短名称（$和_）全球范围供我使用。我想知道这种方法的优点是什么。只是将jQuery重命名为更短的内容？防止我覆盖$？以后更容易在另一个库中交换？我猜这些似乎都不能令我信服。

此外，我也看到了这个：

(function(_) {
    ...code...
})(_);

这里甚至没有更名。我甚至见过：

(function(global) {
    ...code...
})(this); // or window, perhaps

直接使用window有什么问题？

所以我要问的是：

这种做法有名字吗？
这种做法有什么好处？
我是否应该一直使用图书馆，而不是直接使用它们？
我应该传递this或window作为全球范围的参考吗？

Answer 1

这种做法有什么好处？

如果变量（'_'，'$'等）稍后被其他代码覆盖，您的代码将继续按预期工作。它将使用调用包装函数时传入的值。

我是否应该直接传入我正在使用的库而不是直接使用它们？

不，但如果您对上述内容有任何疑虑，这可能是一个很好的做法。此外，如果您查找诸如Require.js之类的AMD加载器，您会发现这是一种熟悉的技术，因为它们会执行类似于定义模块要求的操作。

我应该将此窗口或窗口作为对全局范围的引用传递吗？

this的优点是代码将在有全局范围的地方运行。例如，如果您的代码可能在Node.js服务器上运行，那么就没有window。

Answer 2

这种做法是否有名称？

语法称为自执行匿名函数。我不知道将全局对象传递给函数的任何特殊名称。

这种做法有哪些优势？

正如您所指出的，函数中的var范围变量将是帮助消除全局名称空间的混乱。
jQuery示例通常用于插件中，以便插件可以使用$，同时保持与$.noConflict() (docs)
兼容
```
(function($) {
    ...code...
})(jQuery);
```

通常，将全局或保留对象（如window，document）作为参数传递可以帮助缩小缩小后脚本的大小：

(function(window, document) {
    // A JS minifier can now minify the all occurrences of `window` and
    // `document` within this function.
})(window, document);

我是否应该直接传入我正在使用的库而不是直接使用它们？
我应该将此窗口或窗口作为对全局范围的引用传递吗？

仅在需要考虑缩小或冲突的库变量名时。

JavaScript样式：我应该将哪些内容作为参数传递给我的命名空间函数？

2 个答案: