Question

我无法理解闭包和范围。我很确定我理解它，直到我出现意外行为。

function doSomething () {
    // Code unrelated to frag

    var rightDiv = document.createElement(rightDiv);

    var img, i, frag = document.createDocumentFragment();
    for (i = 0; i < photoIDs.length; i++){
        img = new Image();
        addClass(img, "popup-image-preview");
        img.src = "photos/"+photoIDs[i]+".jpg";
        frag.appendChild(img)
    }
    // add popup for preview
    addEvent(rightDiv, "mouseover", function() {
        showPopup(frag, this);
        console.dir(frag);
    });

    // more code unrelated to frag
}

我预计onmouseover处理程序仍然可以访问包含图像的DocumentFragment。但是当我在控制台中查看它时，它不再有任何孩子了。这个特定的匿名函数是否可以访问 doSomething 的特定执行的局部变量值，或者后续调用doSomething是否会影响先前执行的闭包？后者会让我的情况变得可以理解，因为随后对doSomething的调用可能会有一个空的 frag 。

Answer 1

一般来说，你是对的，你的代码应该像你期望的那样工作。但有一些事情让我们想知道：

rightDiv在哪里定义？看起来您正在向该“节点”添加越来越多的mouseover事件，因为它不是上下文的一部分。
执行addEvent或showPopup修改frag变量上的任何内容？

Answer 2

似乎关闭确实按预期工作。我的错误在showPopup，我将frag附加到文档节点。我不知道这会因此清空DocumentFragment。我现在在node.appendChild(frag.cloneNode(true))中使用showPopup。

感谢大家的帮助

理解闭包及其范围

2 个答案: