javascript - 试图理解js中的闭包问题

Question

选项 1:

function addLinks () {
    for (var i=0, link; i<5; i++) {
        link = document.createElement("a");
        link.innerHTML = "Link " + i;
        link.onclick = function () {
            alert(i);
        };
        document.body.appendChild(link);
    }
}
window.onload = addLinks;

选项 2:

function addLinks () {
    for (var i=0, link; i<5; i++) {
        link = document.createElement("a");
        link.innerHTML = "Link " + i;
        link.onclick = function (num) {
            return function () {
                alert(num);
            };
        }(i);
        document.body.appendChild(link);
    }
}
window.onload = addLinks;

我知道选项1:由于关闭，每次点击都会输出5，但选项2会输出正确的结果，0,1,2...

我的问题是:选项 2 如何解决该问题？选项 2 如何运作？

Answer 1

选项 1 中的变量 i 位于函数 addLinks() 的范围内(因为它在该函数中被声明为 var)。它仅被调用一次，分配给 onclick 的所有五个函数仅共享一个作用域。

在选项 2 中，变量 num 位于匿名函数的范围内(因为它是该函数的形式参数)。被叫了五次；有五个独立的作用域，分配给 onclick 的五个函数中的每一个都有一个作用域。

这有帮助吗？