我想知道这是什么意思:
(function () {
})();
这是在说document。onload吗?
当前回答
(function () {
})();
这被称为IIFE(立即调用函数表达式)。它是著名的JavaScript设计模式之一，是现代Module模式的核心和灵魂。顾名思义，它在创建后立即执行。此模式创建一个隔离的或私有的执行范围。
在ECMAScript 6之前的JavaScript使用词法作用域，因此IIFE用于模拟块作用域。(在ECMAScript 6中，通过引入let和const关键字，块范围是可能的。) 关于词汇范围问题的参考
用IIFE模拟块作用域
使用IIFE的性能优势是能够通过减少范围查找来将常用的全局对象(如window、document等)作为参数传递。(请记住，JavaScript在局部作用域和全局作用域的链中寻找属性)。因此，在局部作用域中访问全局对象可以减少查找时间，如下所示。
(function (globalObj) {
//Access the globalObj
})(window);
其他回答
该构造称为立即调用函数表达式(IIFE)，这意味着它将立即执行。可以把它看作是解释器到达该函数时自动调用的函数。
最常见的用例:
它最常见的用例之一是限制通过var创建的变量的作用域。通过var创建的变量的作用域仅限于一个函数，因此这个构造(这是一个围绕某些代码的函数包装器)将确保你的变量作用域不会泄漏到该函数中。
在下面的例子中，count在立即调用的函数之外是不可用的，即count的作用域不会泄漏到函数之外。您应该得到一个ReferenceError，如果您尝试在立即调用的函数之外访问它。
(function () {
var count = 10;
})();
console.log(count); // Reference Error: count is not defined
ES6备选方案(推荐)
在ES6中，我们现在可以通过let和const创建变量。它们都是块范围的(不像var是函数范围的)。
因此，对于上面提到的用例，您不必使用IIFE的复杂构造，现在可以编写更简单的代码，以确保变量的作用域不会泄漏到所需的块中。
{
let count = 10;
}
console.log(count); // ReferenceError: count is not defined
在本例中，我们使用let定义count变量，使count限制在我们用花括号{…}创建的代码块中。
我称之为“卷毛监狱”。
它是一个立即调用的函数表达式，简称IIFE。它在创建后立即执行。
它与任何事件的任何事件处理程序(例如document.onload)无关。 考虑第一对括号中的部分:(function(){})();....它是一个正则函数表达式。然后看最后一对(function(){})();，它通常被添加到表达式中来调用函数;在这种情况下，我们之前的表达式。
当试图避免污染全局名称空间时，通常使用此模式，因为在IIFE中使用的所有变量(像在任何其他正常函数中一样)在其作用域之外是不可见的。 这可能就是为什么您将此结构与window的事件处理程序混淆的原因。Onload，因为它经常被这样使用:
(function(){
// all your code here
var foo = function() {};
window.onload = foo;
// ...
})();
// foo is unreachable here (it’s undefined)
Guffa建议的更正:
函数在创建后立即执行，而不是在解析后执行。整个脚本块在执行其中的任何代码之前都会被解析。此外，解析代码并不自动意味着它被执行，例如，如果IIFE在函数内部，那么直到函数被调用，它才会被执行。
更新 因为这是一个非常流行的话题，值得一提的是，IIFE也可以用ES6的箭头函数来编写(就像Gajus在评论中指出的那样):
((foo) => {
// do something with foo here foo
})('foo value')
这是一个更深入的解释，为什么你会使用这个:
“使用IIFE的主要原因是确保数据隐私。因为JavaScript的var将变量限定在包含变量的函数内，所以任何在IIFE中声明的变量都不能被外部世界访问。”
http://adripofjavascript.com/blog/drips/an-introduction-to-iffes-immediately-invoked-function-expressions.html
通常，我们不会在程序中写入函数后立即调用它。 简单来说，当您在函数创建后立即调用它时，它被称为IIFE——一个漂亮的名字。
它是一个函数表达式，它代表立即调用函数表达式(IIFE)。IIFE只是一个在创建后立即执行的函数。因此，函数不必等到调用它才能执行，而是立即执行IIFE。让我们通过示例来构造IIFE。假设我们有一个add函数，它接受两个整数作为参数并返回和 让我们把add函数放到IIFE中，
步骤1:定义函数
function add (a, b){
return a+b;
}
add(5,5);
Step2:通过将整个函数声明包装到圆括号中来调用函数
(function add (a, b){
return a+b;
})
//add(5,5);
步骤3:要立即调用函数，只需从调用中删除'add'文本。
(function add (a, b){
return a+b;
})(5,5);
使用IFFE的主要原因是在函数中保留私有作用域。在javascript代码中，你要确保你没有覆盖任何全局变量。有时您可能会意外地定义一个覆盖全局变量的变量。让我们举个例子。假设我们有一个名为iffe.html的HTML文件，body标签内的代码是-
<body>
<div id = 'demo'></div>
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
</body>
好吧，上面的代码将毫无疑问地执行，现在假设您意外或有意地声明了一个名为document的变量。
<body>
<div id = 'demo'></div>
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
const document = "hi there";
console.log(document);
</script>
</body>
你将会看到一个SyntaxError:重新声明不可配置的全局属性文档。
但是如果你想要声明一个名为documentmet的变量，你可以使用IFFE来实现。
<body>
<div id = 'demo'></div>
<script>
(function(){
const document = "hi there";
this.document.getElementById("demo").innerHTML = "Hello JavaScript!";
console.log(document);
})();
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
</body>
输出:
让我们尝试另一个例子，假设我们有一个计算器对象像bellow-
<body>
<script>
var calculator = {
add:function(a,b){
return a+b;
},
mul:function(a,b){
return a*b;
}
}
console.log(calculator.add(5,10));
</script>
</body>
这很神奇，如果我们不小心重新赋值了计算器对象的值。
<body>
<script>
var calculator = {
add:function(a,b){
return a+b;
},
mul:function(a,b){
return a*b;
}
}
console.log(calculator.add(5,10));
calculator = "scientific calculator";
console.log(calculator.mul(5,5));
</script>
</body>
是的，你将结束一个TypeError:计算器。Mul不是if .html的函数
但是在IFFE的帮助下，我们可以创建一个私有作用域，在那里我们可以创建另一个变量名计算器并使用它;
<body>
<script>
var calculator = {
add:function(a,b){
return a+b;
},
mul:function(a,b){
return a*b;
}
}
var cal = (function(){
var calculator = {
sub:function(a,b){
return a-b;
},
div:function(a,b){
return a/b;
}
}
console.log(this.calculator.mul(5,10));
console.log(calculator.sub(10,5));
return calculator;
})();
console.log(calculator.add(5,10));
console.log(cal.div(10,5));
</script>
</body>
输出:
