这是一个立即调用的函数表达式吗？ [英] Is this an immediately invoked function expression?

问题描述

我是一名JavaScript新手，试图围绕此代码进行思考。
我在这里得到了 http：/ /brackets.clementng.me/post/24150213014/example-of-a-javascript-closure-settimeout-inside

我仍然很难理解它。因为它涉及一些我不熟悉的模式。

  //输出0-9，延迟1秒。 
 for（var i = 0; i <10; i ++）{
 setTimeout（function（x）{
 return function（）{
 console.log（x）; 
}; 
}（i），1000 * i）; 
 
 $ / code> 

这段代码中（i）的含义是什么？ p>



  function（x）{
 return function（）{
 console.log（x）; 
}; 
}（i）
  

我认为这是一个立即调用的函数表达式。
但是这不是正确的语法：

$ $ $ $ $ $ $ $ $ $ $（函数（）{
//一些代码
}）（）;


解决方案

确实是一个IIFE。你引用的语法是一个0参数的IIFE;您询问的语法是1个参数的IIFE。它将在内部代码中将 i 分配给 x 。比较：

  var print0 = function（）{
 console.log（Hello！）; 
}; 
 print0（）; 
  

是（孤立的）相当于

 （function（）{
 console.log（Hello！）; 
}）（）; 
  

因此，名称：您创建一个函数，然后立即调用它。

然而，如果你想要一个参数，没有什么变化：

  var print1 = function（name ）{
 console.log（Hello，+ name）; 
}; 
 print1（George）; 
  

是（孤立的）相当于

 （function（name）{
 console.log（Hello，+ name）; 
}）（George）; 
  

这里的圆括号确保函数定义将作为表达式而不是语句。还有其他一些方法可以确保一个普通的方法是：

$ p $ ！function（）{
console.log（你好！）;
}（）;


（但是有理由更喜欢圆括号。）因为您将它用作参数 setTimeout 调用，它不可能是一个声明，所以这些黑客是没有必要的。它仍然被称为立即调用函数表达式，因为您仍在构造函数表达式并立即调用它。

这里使用IIFE的原因是捕获变量 i 的值，而不是 x 的位置。如果没有关闭技巧，你会得到10个超时，所有输出 10 （当 x > console.log 解析）。

I'm a javascript newbie trying to wrap my mind around this code. I got it here http://brackets.clementng.me/post/24150213014/example-of-a-javascript-closure-settimeout-inside

I still have a hard time understanding it. Since it involves some pattern I'm not familiar with.

// output 0-9, seperated by 1 sec delay.
for (var i = 0; i < 10; i++) {
    setTimeout(function(x) { 
        return function() { 
            console.log(x); 
        }; 
    }(i), 1000*i);
}

What is the meaning of (i) in this section of code?

function(x) { 
    return function() { 
        console.log(x); 
    }; 
}(i)

I thought it is an immediately invoked function expression. But isn't the correct syntax for that is:

(function() {
  // some code
})();

解决方案

That is, indeed, an IIFE. The syntax you quote is an IIFE of 0 arguments; the syntax you asked about is an IIFE of 1 arguments. It will assign i to x in the inner code. Compare:

var print0 = function() {
  console.log("Hello!");
};
print0();

is (in isolation) equivalent to

(function() {
  console.log("Hello!");
})();

Thus the name: you create a function, then immediately invoke it.

However, if you want an argument, nothing really changes:

var print1 = function(name) {
  console.log("Hello, " + name);
};
print1("George");

is (in isolation) equivalent to

(function(name) {
  console.log("Hello, " + name);
})("George");

The parentheses here ensure that the function definition will be taken as an expression rather than as a statement. There are other ways to ensure that, a common one being

!function() {
  console.log("Hello!");
}();

(But there are reasons to prefer the parentheses.) Since you are using it as an argument to the setTimeout call, it can't possibly be a statement, so these hacks are not necessary. It is still called "immediately invoked function expression", since you are still constructing a function expression and immediately invoking it.

The reason why an IIFE is used here is to "capture" the value of the variable i, rather than the location of x. Without the closure trick, you would get 10 timeouts, all outputting 10 (the value of the location denoted by x when the console.log resolves).

这篇关于这是一个立即调用的函数表达式吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！