by leonardomso & jakeseo_me # #

6. Function Scope, Block Scope and Lexical Scope

전역 스코프(Global Scope)

• 만일 만일 변수가 모든 함수에 속하지 않고 {}괄호안에 들어있지도 않다면 우리는 그 변수를 전역 변수라 합니다.
• 전역 변수에서 변수 선언을 할 수 있더라도, 전역 변수에서는 변수 선언을 하지 않는 것이 권장됩니다. 왜냐하면 두개 혹은 그 이상의 변수들이 같은 이름을 가지게 되어 네이밍 충돌(naming collisions)이 발생할 확률이 있기 때문입니다.
• 만일 우리가 var 키워드로 변수 선언을 한다면, 우리의 두번째 변수가 첫번째 변수를 덮어씁니다. 이러한 코드를 만들게 되면 디버그 하기가 매우 힘드니 우리는 절대로 이러한 코드를 작성하면 안됩니다.

// Don't do this!
var thing = 'something'
var thing = 'something else' // perhaps somewhere totally different in your code
console.log(thing) // 'something else'

우리는 전역변수 사용을 자제해야 합니다. 지역변수 사용을 지향합시다.

함수는 각자의 스코프에 접근할 수 없다

함수를 각각 선언했을 때, 함수는 다른 함수의 스코프에 접근할 권한을 갖고 있지 않습니다. 심지어 함수 내에서 다른 함수를 불러오더라도 스코프는 사용할 수 없습니다.

아래 예제에서, second는 firstFunctionVariable에 접근할 권한이 없습니다.

function first () {
	const firstFunctionVariable = `I'm part of first`;
}

function second () {
	first();
	console.log(firstFunctionVariable); // Error, firstFunctionVariable is not defined
}

내부 스코프(Nested Scope)

함수가 다른 함수 안에서 만들어졌고 안쪽 함수(inner function)는 바깥 함수(outer function)의 변수에 접근 가능합니다. 이러한 것을 어휘적 스코프(lexical scoping) 라고 합니다.

하지만 바깥 함수에게는 안쪽 함수의 변수에 접근할 권한이 주어지지 않습니다.

function outerFunction () {
	const outer = `I'm the outer function!`;

    function innerFunction() {
    	const inner = `I'm the inner function!`;
        console.log(outer) // I'm the outer function!
    }

  console.log(inner); // Error, inner is not defined
}

스코프가 어떻게 작동하는지 시각화하기 위해서는 안에서는 바깥이 보이지만 바깥에서는 안이 보이지 않는 유리(one-way glass)를 생각하시면 쉽습니다.

클로져(Closures)