var中的变量提升

之前只知道var存在的变量提升，但不知道其原理是什么？

最近看了《深入理解es》 中明白了

当我们写循环的时候

var funcs = [];
		
for(var i=0; i< 10; i++){
   funcs.push(function() {
	console.log(i)
   })
}

funcs.forEach(function(func) {
	func(); // 输出10次数字10
})

是因为循环里每次迭代同时共享着变量i，循环内部创建的函数全部保留了对相同变量的引用

循环结束时，变量i为10，故每次输出都是10

 

当我们把循环改为如下时：

for (var i=0; i< 10; i++){
    funcs.push((function(value){
        return function(){
            console.log(value)
        }
    }(i)))
}

输出结果为 0 到 9

这是因为，在循环内部，IIFE表达式为接受的每一个变量i都创建了一个副本并存储为变量value，这个值就是相应迭代创建函数所使用的值，因此调用每个函数都会像从0到9循一样得到期望的值。

 

es6中的let，const不存在上述的问题，因为其内部也模仿了上述的IIFE表达式来简化循环过程