Scope

Scope

- scope: 어떤 변수에 접근할 수 있는 유효범위, 전역(global)과 지역(local)으로 나뉜다

- 전역 스코프(global scope) : 코드 어디에서나 참조할 수 있다

- 지역 스코프(local scope / function-level scope) : 함수 코드 블록이 만든 스코프, 함수 자신과 하위 함수에서만 참조할 수 있다

- 전역변수 : 함수 바깥에 선언된 변수, window 객체에 선언된 변수

- 지역변수 : 함수 안에 선언된 변수

자바스크립트는 변수의 범위를, 호출한 함수의 지역 스코프부터 전역 스코프까지 점차 넓혀가며 찾는다, 이것을 스코프 체인(scope chain)이라 한다

const drink = 'coffee';
function outer() {
  console.log('외부', drink);
  function inner() {
    console.log('내부', drink);
  }
  inner();
}
outer();
// 외부 coffee
// 내부 coffee

- 위 예에서 inner 함수가 drink 변수를 찾는 순서 : 자기 자신의 스코프에서 찾고, 없으면 한 단계 위 outer 스코프에서 찾고, 없으면 다시 한 단계 올라가서(여기서는 전역 스코프) 찾는다

- 렉시컬 스코프 : 함수를 어디서 선언 했는지(호출이 아닌)에 따라 상위 스코프를 결정하는 방식, 자바스크립트는 렉시컬 스코프를 따른다

var drink = 'coffee'; // {3}
function fnA() {
  console.log(drink); 
}

function fnB() {
  var drink = 'yogurt';
  fnA(); // {2}
}
fnB(); // 'coffee' {1}

위 예에서 함수 fnB를 호출 했을 때{1}, fnA가 fnB 내부에서 호출되지만{2} 지역변수 drink = 'yogurt'를 참조하지 않고 전역변수 drink에 할당된 'coffee'를 출력하게 된다

 

< 참고 >

poiemaWeb - scope

제로초 블로그 - 함수의 범위(scope)