JavaScript匿名函数表达式与IIFE

Question

遇到一些使用立即调用函数表达式（IIFEs）而不是普通函数的代码。

var custom_type = (function() {
    return $('#myDiv').attr('custom_type');
})();

通常我会以类似以下的方式进行编写：

var custom_type = function() {
    return $('#myDiv').attr('custom_type');
};

IIFE的原因是什么？我所能想到的唯一一件事是，IIFE可能只在开始时分配custom_type变量一次，而第二个可能会在每次引用变量时继续检查更新的类型。

- diplosaurus

---

第一个执行函数并存储其结果，第二个将函数存储为定义。 - Rolice

第一个例子等同于var custom_type = $('#myDiv').attr('custom_type')。所以这两个例子有不同的结果（在第一个例子中，custom_type是一个字符串，在第二个例子中它是一个函数），没有上下文的情况下无法确定为什么使用了第一个例子。可以推测编写代码的人不希望custom_type是一个函数。 - Felix Kling

Answer 1

在这个例子中，您可以完全不使用函数，只需要执行以下操作：

var custom_type = $('#myDiv').attr('custom_type');

然而，通常情况下，您可以使用IIFE来进行更复杂的“即时”变量赋值计算 - 如果需要迭代某些内容，我喜欢使用它们，这样就可以拥有i而不会污染当前作用域。

然而，在您的第二个示例中，结果完全不同 - 您需要调用函数custom_type()才能获得当前值，而第一段代码将获得其值一次，并且变量将保持该值。

- Niet the Dark Absol

---

我想这是更好的问题，为什么要使用IIFE而不是直接将其分配给.attr返回值。看起来过于复杂了。 - diplosaurus

Answer 2

IIFE（立即调用函数表达式）将会被立即执行，因此变量将被设置为其响应值。

以下是一个JSFiddle演示，可以通过查看JS控制台输出进行确认：http://jsfiddle.net/Y4JmT/1/

代码如下：

var custom_type = (function() {
    return 'foo';
})();

var custom_type2 = function() {
    return 'bar';
};

console.log('iife = ' + custom_type);
console.log('non-iife = ' + custom_type2);

在您的JS控制台中，您将看到类似于以下内容：

iife = foo 

并且

non-iife = function () {
    return 'bar';
} 

- Jasper

Answer 3

你的第一个函数（IIFE）执行该函数并存储其结果，第二个函数将函数存储为定义。

(function(x) {
    return x * 2;
})(5);

您正在进行类似于普通函数的调用：func(arg1, arg2)，但是您传递的不是函数名称，而是整个函数定义。因此，上述将返回10，如下所示：

function multiply(x) {
    return x * 2;
}

multiply(5);

它们的意思是相同的，都是在进行调用。与第一个不同，第二个是定义加上调用。

- Rolice

Answer 4

IIFEs允许您在创建时调用函数（匿名或其他）。 你看过这个吗？ http://benalman.com/news/2010/11/immediately-invoked-function-expression/

- Chris Walsh