Lexical Scope

Lexical Scope

lexical scope는 간결하게 정의 하기 힘들다.

하지만 javascript 를 다룰 수 있는 개발자라면 이미 알고 있는 개념이며 단지 이를 말로 설명하기 어려울 뿐이다.

 

내 생각엔 lexical scope는 javascript 가 선택한 scope 정책에 의한 scope chain 의 일부분일 뿐이다. 

이해 하기 어려운 이유 중 하나는 static scope 를 lexical scope 라고도 부르는 이유도 있다.

 

lexical scope 대신 static scope 이라 표현하고 dynamic scope 와 함께 비교 해보자.

var x = 1;

function foo() {
    var x = 0;
    bar();
}

function bar() {
    console.log(x);
}

foo(); // ?
bar(); // ?

 

어떤 결과가 나올지 생각해보자.

아래 처럼 생각했다면 dynamic scope 방식으로 생각 한 것이다.

foo(); // 0
bar(); // 1

아래 처럼 생각했다면 static scope 방식으로 생각 한 것이다.

foo(); // 1
bar(); // 1

 

맞다/틀리다를 떠나 첫번째 예를 지원하는 언어(perl)도 있고 두번째 예를 지원하는 언어도 있다. 

javascript는 두번째를 지원하며 이것은 lexical scope 에 의한 예 중 하나이다.

 

이것을 말로 표현한다면

렉시컬 스코프는 함수를 어디서 호출하는지가 아니라 어디에 선언하였는지에 따라 결정된다.

난 이 정의를 처음 접했을 때 이해를 못했다.

또 다르게 이해해보자. 이게 좀 더 명확하다. 대신 javascript의 스코프와 스코프 체인을 알아야 한다.

 

foo()의 scope chain은 window이다.

bar()의 scope chain은 window이다.

 

변수 x 가 함수 안에 선언되어 있지 않다면 scope chain을 따라 상위 scope에서 변수 x를 찾을 것이므로

고민도 없이 global scope의 x를 찾아 출력한다.

 

다시 한번 강조하면 bar()는 foo() 내부에서 실행됐을 뿐 선언 된 것이 아니다. 

이를 이해하고 나서야 비로소 렉시컬 스코프는 함수를 어디서 호출하는지가 아니라 어디에 선언하였는지에 따라 결정된다라는 정의를 이해할 수 있었다.

 

렉시컬 스코프에 대해 여러 문서를 계독을 했지만 결론은 그런데? 이게 뭐? 란 생각이였다. 많이 여러번 읽었기 때문에 아는 것 같지만 계속 헷갈렸고 말로 설명할 수 없었다.

어제 맘 먹고 lexical scope 에 대한 문서를 보고서 깨달았다. 1, 1 로 나오는게 lexical scope 일뿐이며 javascript scope 와 scope chain에 의한 당연한 결과이다.

 

렉시컬 스코프는 정의로 접근하는 것보다 scope 와 scope chain으로 접근하는 게 더 명확하다고 생각한다.