js闭包 返回函数中的循环变量的问题

Question

function count() {
    var arr = [];
    for (var i=1; i<=3; i++) {
        arr.push(function () {
            console.log(i)
            return i * i;
        });
    }
    return arr;
}

var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2];
console.log(f1(),f2(),f3()) //4 4 4 16

最近在看廖雪峰的 js 教程，看到这里有点疑惑，为什么到最后面 i=4 呢？循环语句中条件写出了 i<=3 的啊。希望有大神给我点指点。

Answer 1

for循环是判断后置的。你可以简单理解为：
第一次：i=1，i<=3，条件成立，循环继续；
第二次：i=1+1=2，i<=3，条件成立，循环继续；
第三次：i=2+1=3，i<=3，条件成立，循环继续；
第四次：i=3+1=4，i>3，条件不成立，循环结束。变量i=4被保存下来，i的值不再改变，不再执行循环体里面的内容。

为什么函数在for循环体里面，拿到的i却始终是4呢，那是因为这个函数根本没有执行，只是声明了一个匿名函数，所以不会把i当时的值保存下来，只是保持对i内存位置的引用。要想保存i循环s的值，可以使用闭包。

Answer 2

判定是在 for 里面进行的, 当 i==3这轮循环完了会给 i++, 再次进行条件判定 所以 i 最后为 4

Answer 3

i <= 3 是让 for 循环停止，但是此时 i 的值就是 4。

剩下的就是闭包的作用域问题了。

Answer 4

i<=3即i=3时会进入之后的循环，i++即执行完当前循环为i+1

Answer 5

function count() {
    var arr = [];
    for (let i=1; i<=3; i++) {
        arr.push(function () {
            console.log(i)
            return i * i;
        });
    }
    return arr;
}

var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2];
console.log(f1(),f2(),f3()) //1 2 3 1 4 9