[자바스크립트] 클로저 예제인데 var, let 차이 설명 좀 부탁드릴게요.

Question

esrse · Accepted Answer

closure를 이해하는데 가장 중요한 개념은, 함수가 정의된 위치 기준으로 바깥 environment 를 보존한다는 것입니다. closure는 우리말로, 닫힘, 폐쇄 이런 뜻인데, 집에서 내가 내방에 책상 앞에 혼자 앉아 있는 순간을 떠올려보세요. 우리 자신은 함수입니다. 그리고 문을 닫아둔 내방 자체가 나를 둘러싸고 있는 environment입니다. 그리고 이 공간은 현재 닫혀있어서, 외부에서는 직접 접근할 수 없습니다.function () { console.log(i) } 이것이 함수이며, 이 함수가 사용하는 environment에 있는 변수들을 클로저로 보존해둡니다.그리고 클로저는 countSeconds(howMany) { .. } 이 함수가 종료된 후에도 파괴되지 않고 유지가 됩니다. 클로저를 물고 있는 함수 (지금 예에서는 function() {console.log(i) } 함수)가 더이상 아무데서도 참조되지 않을 때까진 계속 유지됩니다. 첫번째 코드는 for 문 안에 i 가 var로 선언이 돼있습니다.var 의 특징은 function scope입니다. 함수의 전체 위치에서 모두 유효합니다. 즉 for (var i &#61; 1 ; ...) 이렇게 적었지만 사실, countSeconds(howMany) { var i; ... } 이렇게 적은 거나 마찬가지라는 겁니다.countSeconds가 아주 잠깐사이에 실행을 완료하고 종료하지만,setTimeout에 전달해둔 function () { console.log(i)} 콜백이 function scope인 i 지역변수를 바라보고 있기 때문에 클로저가 유지되고 있습니다. 따라서 1초, 2초, 3초가 지난 시점에 i를 읽었을 땐 모두 함수 전체 scope의 i를 똑같이 읽었으니 4가 세번 찍힙니다. 두번째 코드는 for 문 안에 i가 let으로 선언이 돼있습니다.그런데 let의 특징은 block scope라는 것입니다.for 문을 반복할 때마다 새로운 블록으로 간주합니다.첫번째 바퀴를 돌 때 function() { console.log(i) } 함수가 참조하는 i 는 첫번째 바퀴를 돌 때의 i 입니다.두번째 바퀴를 돌 때 function() { console.log(i) } 함수가 참조하는 i 는 두번째 바퀴를 돌 때의 i 입니다.세번째 바퀴를 돌 때 function() { console.log(i) } 함수가 참조하는 i 는 세번째 바퀴를 돌 때의 i 입니다.클로저를 만들 때 block scope인 지역변수를 보존해둔 것이죠.

소환사쇽쇽 · Answer

esrse고맙습니다! for문 안에서 선언된 var 변수는 함수내에서 사용할 수 있는데 const, let은 못 쓰네요. 알려주셔서 감사해요.

[자바스크립트] 클로저 예제인데 var, let 차이 설명 좀 부탁드릴게요.

2개의 답변

#es5 목록