[JavaScript] 심화 - 스코프 체인, Call 객체, 클로저

 

 

변수의 처리 순서 - 스코프 체인

자바스크립에서 스크립트 실행 시 내부적으로 글로벌 객체를 생성한다. 글로벌 객체는 글로벌 변수나 글로벌 함수를 관리하기 위한 편의적인 객체로 글로벌 변수나 글로벌 함수는 글로벌 객체의 프로퍼나 메소드이다.

 

로켈 변수도 Activation 객체(통칭 Call 객체)의 프로퍼티이다. Call 객체는 함수 호출이 있을 때마다 내부적으로 자동 생성되는 객체이다.

 

변수를 처리하는 과정에 관여하는 것이 스코프 체인이다. 스코프 체인이란 글로벌 객체, Call 객체를 생성 순서대로 연결하 리스트를 말한다. 

var y = 'GLoBal';
function outfunc() {
    var y = "LINNER";
    function innerFunc() {
        var z = "LOCAL";

        console.log(z);    // LOCAL
        console.log(y);    // LINNER
        console.log(x);    // 에러
    }
    innerFunc();
}

outfunc();

위의 예시 코드에서는 스코프 체인이 "글로벌 객체 - oufunc 내부의 Call 객체 - innerFunc 내부의 Call 객체"로 스코프 체인이 연결된다. 따라서 console.log(y) 코드를 실행할 때 innerFunc 내부의 Call 객체를 살펴보고 일치하는 것이 없으니 outfunc 내부의 Call 객체를 살펴본 후 LINNER 라는 값을 출력하게 된다.

 

 

같은 행동을 하는 객체 - 클로저

클로저(Closure)란 로컬변수를 참조하고 있는 함수 내의 함수를 말한다.

function closure(init) {
    var counter = init;

    return function() {
        return ++counter;
    }
}

var myClosure = closure(1);
var myClosure2 = closure(100);

console.log(myClosure());    // 2
console.log(myClosure2());   // 101
console.log(myClosure());    // 3
console.log(myClosure2());   // 102

 

위의 코드의 동작을 이해해보면,먼저 closure(1) 이 호출되었을 때 반환값으로 익명 함수를 반환하고 있다. closoure(1) 함수가 호출되고 익명 함수를 myClosure 변수에 반환되고 나면 clouser(1)는 종료된다. 하지만 익명 함수가 clouser(1) 함수의 로컬 변수 counter 를 계속 참조하고 있기 때문에 로컬 변수 counter 는 계속 보관되어 유지된다.

 

스코프 체인의 개념과 같이 생각해보면 "익명 함수의 Call 객체- closure 함수의 Call 객체 - 글로벌 객체" 의 순으로 스코프 체인을 유지하고 있다. closure 함수는 종료되었어도 원래의 closure 함수와는 독립적으로 Call 객체에 저장된 counter 변수가 동작할 수 있다.