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 的五个功能中的每一个。

这有帮助吗？