스코프 체인과 클로저

스코프 체인 (Scope Chain)

스코프 체인은 프로그래밍 언어에서 변수의 유효 범위(scope)를 결정하는 메커니즘 중 하나이다. 이는 어떤 변수가 어떤 범위에서 참조되는지를 나타내는 개념이다. 스코프 체인은 변수가 해당 범위에 존재하지 않을 경우, 상위 범위에서 변수를 찾아나가는 방식으로 작동한다.

스코프 체인의 동작 방식을 이해하기 위해서는 렉시컬 스코핑(lexical scoping)과 관련된 개념을 알아야 한다. 렉시컬 스코핑은 함수가 정의된 위치에 따라 변수의 범위가 결정되는 것을 의미한다. 즉, 함수는 그 정의된 위치의 스코프 내에서만 해당하는 변수에 접근할 수 있다.

다음의 예시를 통해 스코프 체인의 개념을 살펴보자.

let outerVariable = "I am outer";

function outerFunction() {
  let innerVariable = "I am inner";

  function innerFunction() {
    console.log(outerVariable); // outerFunction 스코프에서 변수를 찾음
    console.log(innerVariable); // innerFunction 스코프에서 변수를 찾음
  }

  return innerFunction;
}

let closureExample = outerFunction();
closureExample();

변수의 범위는 블록 스코프(block scope)로 제한된다. 블록 스코프란, 중괄호 { } 로 둘러싸인 영역을 뜻한다. 따라서 innerVariable과 outerVariable은 각각 해당하는 블록 스코프 내에서만 접근할 수 있다.

이 예시에서 innerFunction은 outerFunction 내부에서 정의되었기 때문에, innerFunction은 자신의 블록 스코프인 innerFunction 스코프와 outerFunction 스코프에 접근할 수 있다. 이때 스코프 체인이 발생하는데, 변수를 찾을 때는 현재 블록 스코프부터 시작하여 외부 블록 스코프로 거슬러 올라가며 변수를 찾는다.

클로저 (Closure)

클로저는 함수와 함수가 정의된 어휘적 범위(Lexical Scope)와 관련하여 동작하는 메커니즘이다. 클로저는 함수가 어떤 데이터와 함께 "닫힌(closed)" 상태로 저장되어, 해당 함수가 이미 종료되었더라도 해당 데이터에 접근할 수 있는 기능을 의미한다.

자세히는, 내부함수가 참조하는 외부함수의 지역변수가 외부함수가 리턴된 이후에도 유효성이 유지될 때, 이 내부함수를 클로저라고 부른다. 클로저는 자신의 코드 블록 내에 정의된 변수, 외부 함수에 정의된 변수, 전역 변수에 대한 접근 총 3가지의 스코프 체인을 가진다고 할 수 있다.

클로저는 외부함수 변수의 값이 아닌 참조를 저장하는 식으로 동작한다. 만약 클로저가 호출되기 전에 외부함수의 값이 변경된다면, 클로저는 참조를 저장하므로 변경된 값을 내놓게 된다.

function outerFunction() {
  let outerVariable = "I am outer";

  function innerFunction() {
    console.log(outerVariable); // 함수안의 내부함수를 클로저라고 부르고, innerFunction()이 클로저이다.
  }

  return innerFunction;
}

// outerFunction 실행 완료, 하지만 innerFunction은 여전히 outerVariable에 접근 가능한 상태로 존재
let closureExample = outerFunction(); 	

// 클로저를 통해 outerVariable에 접근하여 값 출력
closureExample(); 					

스코프 체인과 클로저는 서로 깊게 연관된 개념이다. 스코프 체인은 클로저의 동작 방식을 이해하는 데 중요한 역할을 한다. 간단하게 말하면, 클로저는 스코프 체인을 통해 외부 함수의 변수에 접근할 수 있는 메커니즘이다.