理解IIFE：为何推入函数表达式而非执行值？数组元素问题解析

一、为什么makeFunctionArray3的arr中存储的是函数而非x的值？ #

咱们先拆解这段代码里的核心逻辑：

arr.push( (function(x) { 
  return (function() { console.log(x) }) 
})(i) )

这里推入数组的是立即执行函数表达式（IIFE）执行后的返回值，但这个IIFE内部并没有直接返回x的数值，而是返回了一个未执行的匿名函数——也就是function() { console.log(x) }。

具体细节：

• 每次循环时，IIFE会立刻执行，把当前循环的i当作参数传入，赋值给x。因为IIFE创建了独立的作用域，每个x都是当前i的“快照”，不会被后续循环的i覆盖。
• 但IIFE的返回值是一个新的函数，这个函数形成了闭包，牢牢“抓住”了当前作用域里的x。
• 所以最终数组arr里存的都是这些待执行的闭包函数，而非x的具体值。当你调用functionArr[3]()时，才会触发这个闭包，打印出对应的x（也就是循环第4次时的i=3）。

二、为什么makeFunctionArray4的数组元素是undefined？ #

虽然你贴的makeFunctionArray4代码不完整，但结合常见的类似场景，大概率是代码里推入数组的是函数执行后的结果，且该函数没有明确返回值。

举个最典型的例子，如果makeFunctionArray4是这样写的：

function makeFunctionArray4() { 
  console.log('four') 
  const arr = [] 
  for (var i = 0; i < 5; i++) { 
    // 这里的IIFE只有打印逻辑，没有return任何内容
    arr.push( (function(x) { console.log(x) })(i) ) 
  } 
  return arr 
}

此时，每次推入数组的是IIFE执行后的结果，但这个IIFE内部只有console.log(x)，没有return语句——在JavaScript中，函数如果没有明确返回值，会默认返回undefined。所以最终数组arr的每个元素都是undefined。

如果是其他类似写法（比如推入的普通函数被不小心加了括号立即执行，且函数本身无返回值），核心原因也是一样的：推入数组的是函数执行的结果，而非函数本身，且该执行结果没有明确返回值，所以最终是undefined。

内容的提问来源于stack exchange，提问作者DCR