클로저(closure)와 스코프(scope)

스코프(scope)는 '범위'라는 뜻을 가지고 있다. 즉, 스코프라는 단어 그대로 접근해서 사용 할 수있는 범위라고 생각하면 이해가 쉽다.

그래서 블록스코프(block scope)와 글로벌 스코프(global scope)가 있는데 이것도 말그대로 블록 스코프 블록안에서만 접근해서 사용이 가능한 것이고, 글로벌 스코프는 블록 밖에서 선언된 변수는 어디서든 접근할 수 있다는 뜻이다.

스코프가 어렵고 헷갈릴때 하나만 기억 해두자
안쪽스 코프에서 바깥쪽 스코프에는 접근이 가능하지만
바깥쪽 스코프는 안쪽스코프의 접근이 불가능하다.

글로벌스코프(Global scope)

const vvs = 'Hello';

function outer(){
  	console.log(vvs)  // 'Hello' 출력
}

console.log(vvs)  // 'Hello' 출력

위처럼 글로벌 스코프(global scope)는 모든 범위에서 사용이 가능하다.

블록 스코프(block scope)

{
  let vvs = 'hello'
  console.log(vvs) // 'hello' 출력
}

console.log(vvs)  // vvs is not defined

블록 스코프는 블록 단위 내에서만 사용이 가능하다.

{
 var vvs = 'hello' 
}

console.log(vvs) // 'hello'출력

하지만 var를 사용해서 변수를 선언하게 되면 전역 스코프와 함수 스코프만 사용하겠다는 의미로 블록 밖에서 console.log를 해도 정상적으로 'hello'가 출력된다.

스코프 체인(scope chain)

자바스크립트 엔진은 식별자를 찾을 때 일단 자신이 속한 스코프에서 찾고 그 스코프에 식별자가 없으면 상위 스코프에서 다시 찾아 나간다. 이 현상을 스코프 체인 이라고 하며 스코프가 중첩되어있는 모든 상황에서 발생한다.

var x = 1;

function vvs(){
    console.log(x); // -> 현재 자신의 스코프(foo 함수 내부)에 x가 없지만 상위 스코프인 전역에서 x를 찾는다.
}

console.log(x); // 1
vvs(); // 1

클로저(closure)

클로저는 return 으로 끝난 외부함수를 내부함수가 계속해서 접근해서 사용할수있게 해주는것을 클로저라고 한다. 즉 내부함수가 외부함수의 지역변수에 접근 할 수 있고, 외부함수는 외부함수의 지역변수를 사용하는 내부함수가 소멸될 때까지 소멸되지 않는 특성을 의미한다.

function outter(){
    var title = 'coding everybody';  
    return function(){        
        alert(title);
    }
}
inner = outter();
inner();  // 'coding everybody'