一道前端面试题的疑问

Question

原题目是这样的：

求输出值

var i = 10;function foo () {
    console.log(i)
}
(function (fn) {
    var i = 20
    fn()
})(foo)

结果是10，为什么不是20呢，根据作用域链，传进来的这个foo函数在执行 console.log(i) 时，不是应该先在这个块级作用域里找变量 i 的值吗？

我在chrome控制台又写了这样一段类似的代码：

var i = 10;(function () {
    var i = 20;
    (function () {
        console.log(i)    
        })()
})()

不过这次输出了20，我的疑问是，同样是在一个闭包中执行的 console.log(i) ，面试题中是匿名函数作为参数传入，能不能帮我分析一下两者的不同。。。

这个问题对很多人来讲应该挺初级的，但是我就是一时想不明白了，还望大神们给个详细的分析，菜鸟在此谢过了。

Answer 1

在运行之前会先生成作用域链。从上到下一行行解析后，foo的作用域链中，i是指向最外层的那个i = 10的，你在立即执行函数中执行的foo已经规定好i是指向最外层的i了。理解JavaScript的作用域链