정적 스코프

렉시컬 스코프(Lexical Scope)라고도 불립니다. 렉시컬 특성을 활용한 스코프 방식입니다. 렉시컬 특성은 함수 실행 시 유효범위를 함수 정의 환경을 기준으로 하기 때문에 아래의 예제처럼 func1 함수에서 global 이 출력이 되었음을 확인할 수 있습니다.

var x = "global"
 
function func1() {
  var x = "local";
  func2();
}
 
function func2() {
  console.log(x);
}
 
func1();  // global
func2();  // global

동적 스코프

렉시컬 소코프가 소스코드가 작성된 그 문맥에서 결정된다고 하면, 동적 스코프는 프로그램의 런타임 도중의 실행 컨텍스트나 호출 컨텍스트에 의해 결정이 됩니다. 자바스크립트는 렉시컬 특성을 가지고 있습니다.

블록 스코프

자바스크립트는 기본적으로 함수 스코프를 지원하지만, 블록 스코프도 역시 지원한다.

• with 역시 블록 스코프를 지원하지만 추가적인 스코프를 생성하는 추가적인 자원 소모가 있기 때문에 사용하지 말자.

• try/catch 의 catch 부분에서 선언된 변수는 catch 블록 스코프에 속한다

try {
  f();
} catch(err) {
  console.log(err);
}
 
console.log(err);   // ReferenceError

• let키워드(ES6)를 사용하면 선언된 변수를 둘러싼 블록의 스코프를 이용한다.

var foo = true;
 
if(foo) {
  {
    let bar = foo * 2;
    console.log(bar);
  }
}
 
console.log(bar);   // ReferenceError

중첩 스코프

중첩 스코프는 가장 인접한 지역을 우선하여 참조합니다.

var foo = function ( ) {
 
  var a = 2, b = 3;
 
  var bar = function ( ) {
    var b = 5, c = 6;
 
    // 이 시점에서 a는 2, b는 5, c는 6
 
    a += b + c;
 
    // 이 시점에서 a는 13, b는 5, c는 6
 
  };
 
  // 이 시점에서 a는 2, b는 3, c는 not defined
 
  bar( );
 
// 이 시점에서 a는 13, b는 3
};

Scope

Scopes는 유효범위를 나타내며, 전역 유효 범위와 지역 유효범위로 나누어집니다.

자바스크립트의 유효범위란?

크게 아래의 특징이 있습니다.

함수 단위의 유효범위

블로 단위가 아닌 함수 단위로 유효 범위가 정의되기 때문에 아래의 a, b, c 변수는 모두 같은 유효범위를 갖습니다.

function A() {  
    var a = 0;
    if (true) {
        var b = 0;
        for (var c = 0; c < 5; c++) {
            console.log("c=" + c);
         }
         console.log("c=" + c);
    }
    console.log("b=" + b);
}
A();  

변수명 중복 허용

같은 변수명이 여러 개 있을 경우, 변수를 참조할 때 가장 가까운 범위의 변수를 참조합니다.

var scope = 10;  
function A(){  
    var scope = 20;
    console.log("scope = " +scope);
}
A();  

var 키워드의 생략

var 키워드를 빼먹고 변수를 선언할 경우 전역 변수로서 선언이 됩니다.

렉시컬 특성

렉시컬 특성이란 함수 실행 시 유효범위를 함수 실행 환경이 아닌 함수 정의 환경으로 참조하는 특성입니다.

아래 예제처럼 함수 정의될 때의 환경을 보기 때문에 변수 a를 찾을 수 없다는 에러 메시지가 출력됩니다.

function f1(){  
    var a= 10;
    f2();
}
function f2(){  
    return a;
}
f1();
 
// Error : a is not defined

아래 코드를 실행하게 되면 전역 전역 변수 a와 함수 변수 f가 정의가 됩니다. 그런 다음에 f()를 실행하면 함수 f가 호출되고 f 레벨의 파싱이 일어나게 됩니다. 이 파싱의 결과로 함수 내부에 있는 a가 변수 스포크 객체에 정의가 됩니다.

var a = 20;
function f(){  
    console.log(a); // 20
    var a = 10;
    console.lgo(a); // 10
}
 
f();