为什么要包装每一个原型“;类“;JS中具有匿名函数的对象

Why wrap every prototype "class" object with an anonymous function in JS?

本文关键字：对象 函数 JS 包装 每一个 原型 为什么      更新时间：2023-09-26

看看David Fowler的这段JS代码，他用一个匿名的自执行方法包装了每个"类"，并在jQuery和window中发送。我知道这是一种确保$和window实际上是全局jQuery和winndow变量的方法

但这不是有点过于保护了吗？你应该保护自己不受其他人更改$和window变量的影响吗？真的有代码可以这样做吗？如果有，为什么？此外，像这样包装所有东西还有其他优点吗？

如果我没记错的话，除了jQuery，还有一些其他库使用$。

使用函数上下文创建本地/功能范围的概念旨在保护您自己的代码。如果您希望您的Javascript代码在一个可能加载多个其他（甚至可能未知）脚本的环境中运行，那么这尤其有意义。

因此，如果在您之前加载的其他Javascript代码为window.$分配了一些其他值（例如，它可能加载原型框架），那么如果您试图访问jQuery特定的东西，那么您的代码就已经被破坏了。

另一点是"a-hole"效应。有人创建了一条类似的线路

window.undefined = true;


现在，所有针对undefined的检查都将几乎失败。但是，通过显式地创建这些变量/参数并用您期望的值填充它们，您可以避免所有这些问题。

(function(win, doc, $, undef) {
}(window, window.document, jQuery));

通常，大多数顶级JavaScript代码都应该封装在IIFE中，无论它们是否传递特定的变量。这可以防止使用var创建的变量污染全局范围。

另一个小好处是缩小：如果你缩小你的代码，通过将window作为参数传入，使其成为一个"局部变量"，可以让缩小程序重命名它。然而，如果你用gzip，这个好处就会消失，所以这不是一个真正的胜利。

大多数情况下，人们只是为他们的IIFE选择一种模式并坚持下去，所以在他的情况下，他决定这就是他编写.js文件的方式，而且他是一致的。有一个统一的标准本身就很有价值。

为了澄清，代码可以用以稍长的形式编写

(function () {
    var $ = jQuery;
    var window = window;
    // ...
}());

匿名函数内部的代码是函数范围，因此它可以防止与全局变量发生冲突。

想象一下，如果每个jQuery插件都没有封装在一个匿名函数中，那么就会出现一个全局变量地狱。

这只是为了保持完整性。$可以是Prototype，所以如果其他人添加了覆盖$的库/变量，那么将jQuery作为参数发送将保存您的代码。

关于第二个参数"window"，我认为它是一个你想写的模块。

相关文章：