본문 바로가기

Front-End/Javascript

Closure

1
2
3
4
5
6
7
8
9
10
11
12
13
function makeAdders(n) {
    var adders = [];
    for (var i = 0; i < n; i++) {
        adders.push(function (x) { return i + x; });
    }
    return adders;
}
 
var adders = makeAdders(10);
var add5 = adders[5];
var r = add5(2);
console.log(r);
// We expect 7, but 12 is printed.


 





익명함수 ( i+x )를 만들 때 var i의 주인은 function makeAdders 이다. Javascript에서는 이 변수를 넘길 때 Closure라는 scope를 가지고 넘긴다. 외부함수 makeAdders의 변수 i에 접근할 수 있는 내부함수 function(x)을 Closure라 한다. 여기서 문제는 var i가 익명함수의 것이 아니라 function makeAdders의  var i를 가리키고 있다. 



ES6의 let 을 사용하면 내가 아는 Block Scope을 가지게 된다. 문제해결!

'Front-End > Javascript' 카테고리의 다른 글

Web Worker(웹 워커) - 멀티 스레드 쓰고 싶어!  (0) 2018.02.21
Prototype, Object 이해하기  (0) 2017.11.04
Closure  (0) 2017.06.20
Shadow DOM  (0) 2017.04.28
문서 스크립팅  (0) 2017.04.27
Section 5:Object-Oriented Javascript and Prototypal Inheritance  (0) 2017.04.25