Javascript 带文档参数的自调用匿名函数

我试图理解以下两者之间的区别：

(function(document) {
    //do stuff with document
})(document);

及

---

我不确定为什么约定似乎要将

文档

传递给函数，有时还要将

窗口

传递给函数？这与范围有关吗？

如果您使用像UglifyJS这样的压缩器/uglifier，这将变得特别方便。然后用say

a

替换

文档

，使代码更短

大概是

(function(document, window){
  var body = document.body;
  var foo = document.querySelector('foo');
  var bar = document.querySelector('bar');
})(document, window);

变成

(function(a, b){
  var c = a.body;
  var d = a.querySelector('foo');
  var e = a.querySelector('bar');
})(document, window);

如果你没有在函数中放置文档和窗口，它只会一直显示文档

(function(){
  var c = document.body;
  var d = document.querySelector('foo');
  var e = document.querySelector('bar');
})();

---

立即调用函数表达式（IIFE）创建一个新的局部范围。就像任何函数一样，调用它时可以传入参数<代码>文档和

窗口

是JavaScript web api中的全局变量，在浏览器中运行js时可用。通过将它们传递到一个生命体中，由于范围的限制，您可以在其中以任何方式访问它们。例如：

(function(w, d) {
  console.log(w); // window
  console.log(d); // document
})(window, document);

console.log(w); // Uncaught ReferenceError: w is not defined
console.log(a); // Uncaught ReferenceError: a is not defined

---

原因

w

和

a

未在第二组

控制台中定义。日志

s是因为它们在本地作用于IIFE。

原因如下：

1。使用较少的全局变量 通过向函数注入全局变量，它将只依赖于参数，而不依赖可能多次使用的全局变量

2。创建本地范围 IIFE是一种通过声明函数并立即调用它来创建新范围的方法。有关更多信息，请参阅

3。更好的缩小

例如，如果您将缩小示例，则将从以下内容更改：

(function(document) {
    //do stuff with document
})(document);

为此：

(function(a) {
    //do stuff with a
})(document);

请注意

a

，它比

文档

短

---

编辑：固定打字错误

但是如果你不放任何文档，那么它不是短吗？（）比（a）短。@victor175是的，这是我问他的。是的，但如果你在JS文件中多次使用

文档

，它最终会短得多哈，是的，只有一行代码，这并不重要，编辑了我的回答，为什么我希望它们在本地范围内？范围是一个极其重要的编程范例。它可以防止命名冲突和意外行为。有用的链接。找到了这个答案：“使用iLife的性能优势是能够通过减少范围查找将常用的全局对象（如窗口、文档等）作为参数传递。（记住Javascript在本地范围中查找属性，并向上链接到全局范围）。因此，在本地范围访问全局对象可以减少查找时间，如下所示。“

(function(a) {
    //do stuff with a
})(document);