2011-07-18 9 views
3

클로저와 범위를 이해하는 데 문제가 있습니다. 나는 뜻밖의 행동을 취하기 전까지 그것을 이해했다는 것을 확신했다.클로저와 범위 이해

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이 비어있을 수 있으므로 내 상황을 이해할 수있게합니다.

+1

저는 폐쇄가 예상대로 작동해야한다고 생각합니다. 기묘한. –

+0

AFAIK, 귀하의 가정이 맞습니다. 이것은 다른 이유가 있어야합니다. 그렇지 않으면 어떤 구석 구석에 충돌합니다 ... –

+0

'doSomething'을 다시 호출하고 이벤트를 다시 바인딩했기 때문에 그것이 그럴지 궁금합니다. 이것이 오래된 이벤트 바인딩을 버릴 것인지 확신하지 못한다. (브라우저에서 JS를 잘 모른다.) –

답변

0

클로저가 예상대로 작동하는 것으로 보입니다. 내 잘못은 showPopup에 있었는데, 문서 노드에 frag을 추가하고있었습니다. 결과적으로 DocumentFragment가 비어 있다는 것을 알지 못했습니다. showPopupnode.appendChild(frag.cloneNode(true))을 사용 중입니다.

도움을 주셔서 감사합니다.

0

일반적으로 말하면 올바른 것이며 원하는대로 코드가 작동해야합니다.

  • 곳이 rightDiv

    을 정의한다 : 그러나 수 있도록 몇 가지 우리가 궁금해 있나요? 문맥의 일부가 아니기 때문에 그 "노드"에 더 많은 수의 mouseover 이벤트를 추가하는 것 같습니다.

  • do addEvent 또는 showPopupfrag 변수의 내용을 수정 하시겠습니까?

+0

죄송합니다 .. 예. 각 실행마다 고유 한 설명을 편집했습니다. – rewolf

+0

@rewolf : 코드를 어디에 표시 할 수 있습니까? 선언 된 위치와 정의 된 코드는 무엇입니까? – jAndy

+0

그 정의의 라인을 추가했습니다. ** doSomething **는 기본적으로 정보가 포함 된 div와 rightDiv라는 다른 div를 만듭니다.이 div를 사용하면 팝업에서 이미지를 볼 수 있습니다. 그러나 ** divSmething **에 의해 생성 된이 divs 중 많은 수가 팝업없이 표시됩니다. – rewolf