Scope

---

• 스코프란, 변수 접근 규칙에 따른 유효 범위를 의미한다.
• 적용 범위는 조금 더 넓은 범위의 전역 스코프와, 그 아래 개념인 지역 스코프가 있다.
  
  
• 스코프에는 몇가지 규칙이 있다.

1. 중첩 규칙
   • 스코프는 중첩이 가능하다.

let global = "global"
console.log(global)			// "global"
console.log(local)			// ReferenceError: local is not defined
console.log(deepLocal)			// ReferenceError: deepLocal is not defined

for (let i = 0; i < 5; i++) {
    let local = "local"
    console.log(global)			// "global"
    console.log(local)			// "local"
    console.log(deepLocal)		// ReferenceError: deepLocal is not defined
    
for (let j = 0; j < 5; j++) {
    let deepLocal = "deepLocal"
    console.log(global)			// "global"
    console.log(local)			// "local"
    console.log(deepLocal)		// "deepLocal"     
    }
}
	//선언한 변수는 밖에서 안으로 들어가며 중첩이 된다.

2. block scope와 function scope

   • block scope

     괄호를 기준으로 scope가 나뉘는 것이 block scope다. (if문, for문 ...)

   • function scope

     함수를 선언하는 function부터 scope가 나뉘는 것이 function scope다. (함수 선언식, 함수 표현식)

3. 전역 스코프와 지역 스코프

let global = "global"
console.log(global)					// "global"
console.log(local)					// ReferenceError: local is not defined
console.log(deepLocal)				// ReferenceError: deepLocal is not defined
for (let i = 0; i < 5; i++) {
    let local = "local"
    console.log(global)				// "global"
    console.log(local)				// "local"
    console.log(deepLocal)			// ReferenceError: deepLocal is not defined
}

for (let j = 0; j < 5; j++) {
    let deepLocal = "deepLocal"
    console.log(global)			// "global"
    console.log(local)			// "local"
    console.log(deepLocal)		// "deepLocal"
}

위 코드에서는 global이 전역 스코프에 위치한 전역 변수를 의미한다.

local과 deepLocal은 지역 변수를 의미한다.

보통 가장 바깥의 스코프를 전역 스코프라고 한다.

4. 전역 변수와 지역 변수간의 우선 순위

   • 변수간의 우선순위는 지역 변수가 더 높다.

let test = "test"
    
function what () {
    let test = "fake"
    console.log(test)
}
    
console.log(test)		// "test"
what()					// "fake"
console.log(test)		// "test"

첫 출력에선 아직 함수가 호출되기 전이라서 위에서 선언한 test가 그대로 출력된다.

두번째 출력은 함수를 통한 출력이다.
함수 내부에서 test 변수에 test 변수를 새로 해주었기 때문에 "fake"가 출력된다.
이는 전역 변수 test와 지역 변수 test는 다르게 취급되기 때문이다.

세번째 출력에선 전역 변수 "test"가 다시 출력된다.
함수 내부에 있는 값에는 스코프 규칙에 의해 접근할 수 없기 때문이다.

let test = "test"
    
function what () {
    test = "fake"
    console.log(test)
}
    
console.log(test)		// "test"
what()					// "fake"
console.log(test)		// "fake"

첫 출력에선 아직 함수가 호출되기 전이라서 위에서 선언한 test가 그대로 출력된다.

두번째 출력은 함수를 통한 출력이다.
함수 내부에서 test 변수에 "fake"를 재할당 해주었기 때문에 "fake"가 출력된다.

또한 let 선언 키워드를 사용하지 않았기 때문에, 전역 변수 test와 같은 test를 사용하겠다는 의미이다.

세번째 출력에선 "fake"가 출력된다.
함수 내부에서 선언해준 test = "fake"의 test는 전역 변수 test와 같은 것이기 때문에 값이 변하게 된 것이다.