Question

我开始更详细地研究JS，在测试了一些代码后我得出了这种情况：

var hello = function ()
    {
        console.log(arguments);
        return (function(x,y){console.log(arguments);return x*y;});
    }();
console.log(hello(2,5));

控制台的输出如下：

[object Arguments] { ... }
[object Arguments] {
  0: 2,
  1: 5
}
10

有人可以解释一下这种行为，因为我无法理解它。

我理解第一个函数是IIFE，它在创建时立即执行。我唯一的问题是如何将传递的参数传递给内部函数？

提前感谢您提供的信息和评论

Answer 1

好的，让我看看能不能为你解开这个：

var hello = function ()
    {
        console.log(arguments);
        return (function(x,y){
          console.log(arguments);
          return x*y;
        });
    }();
console.log(hello(2,5));

首先，我要将IFFE拆分为函数语句。它的工作方式相同，但更像传统代码：

// Create our function
function action(x, y) {
          console.log(arguments);
          return x*y;
}

var hello = function ()
    {
        console.log(arguments);
        //Here we are returning a REFERENCE to a function that already exists.
        // We are *not* running the `action` function -- just getting its 
        // reference so it can be called later.
        return action;
    }();

// At this point in time, if you did a
console.log(hello)

// You'd see that it just points to the `action` function -- since that is what the 
// IIFE returned.

console.log(hello(2,5));

值hello现在是我们的action函数。

IFFE语法具有以下优点：

由于它是匿名函数，因此您不使用名称或使全局对象混乱。
代码更“直线”，而不是分成两个单独的部分。

顺便说一下，如果我解释function statement和function expression之间的差异，可能会有帮助。

函数语句如下所示：

function functionStatemnt() {
...
}

functionStatement在编译完成时可用。该代码不需要执行才能使用。

函数表达式更像是：

var functionExpression = function() {
...
};

IFFE是一个立即调用的函数表达式。为您提供了一种创建范围和“隐藏”变量的方法。

var myCounter = function() {
  var counter = 0;
  return function() {
    return counter++;
  }
}

console.log(myCounter());
console.log(myCounter());
console.log(myCounter());

JS IIFE和带参数的内部函数

1 个答案: