Scope와 Closure

1. 스코프(Scope)란 ?

현재 실행되는 컨텍스트를 말한다. 예를 들면 함수 내부에서 선언된 변수는 함수 밖 혹은 다른 함수에서 사용이 불가능한것과 같은데 아래와 같은 예제를 보면 이해 할 수 있다.

<-- O -->
function example () {
	let a = 10;
    console.log(a)
}

example() // 10

<-- X -->
function example () {
	let a = 10;
}

function example2 () {	
    console.log(a)
}

example2() // null

<-- 함수 밖 전역으로 선언된 변수는 사용 가능 -->

let a = 10;

function example(){
	console.log(a)
}

example()

2. 렉시컬 스코프(Lexical Scope) 란 ?

함수가 어디서 호출 되었는지가 아니라 어디서선언하였는지에 따라 Scope가 결정되는 것을 말하며 다른말로 정적 스코프(Static Scope)라고하며 Javascipt는 이 정적 스코프를 따른다.
반대인 동적 스코프(Dynamic Scope)는 함수가 어디서 호출 되었는지에 따라 Scope가 결정된다.

let a = 1 // 전역 변수 
function example1(){
	let a = 10;
    example2()
}
function example2(){
	console.log(a)
}

example1()
example2()

결과
1
1

이처럼 렉시컬 스코프에선 선언된 위치에 따라 상위 Scope가 결정되기 때문에 example2의 상위 스코프인 전역변수 a가 2번 호출되는 것을 알 수 있다.

3. Closure란 ?

클로저(Closure)란, 어떤 함수에서 선언한 변수를 참조하는 내부 함수(inner function)를 외부로 반환할 때, 내부 함수가 참조하는 변수가 소멸되지 않고 계속 유지되는 현상을 의미한다.

function outerFunction() {
  let count = 0;

  function innerFunction() {
    count++;
    console.log(count);
  }

  return innerFunction;
}

let myInnerFunction = outerFunction();
myInnerFunction(); // 1
myInnerFunction(); // 2

이처럼 innerFunction()는 부모인 outerFunction()을 참조하여 outerFunction()의 count를 1씩 늘리고 있는데 myInnerFunction()을 여러번 호출해도 outerFunction()의 변수인 count의 값이 소멸하지 않고 계속 1씩 더해지는걸 볼 수 있는데 이러한 현상이 closure다.