자바스크립트의 변수, 함수에는 스코프가 존재한다.

스코프는 자바스크립트에서 어떤 변수들에 접근할 수 있는지를 나타낸다.

 

ES5 까지는 함수 레벨의 스코프(function scope)만 사용 가능했으나,

ES6 부터는 let과 const로 블록 레벨의 스코프(block scope)를 사용할 수 있다.

 

이 스코프에 대해서 알아보자

 

https://www.edwith.org/boostcourse-web/lecture/16693/

 

[LECTURE] 1) 자바스크립트 변수-연산자-타입 : edwith

들어가기 전에 컴파일 단계가 없는 자바스크립트의 type(형)은 실행단계에서 타입이 결정됩니다. 변수선언은 어떻게 정의하고, 자바스크립트의 타입은 어떤 것들이 있는지 확인해봅니다.... - 부스트코스

www.edwith.org


스코프와 레벨

스코프는 다음과 같이 구성된다

  • 전역 스코프
  • 지역 스코프
    • 함수 레벨 스코프
    • 블록 레벨 스코프

앞서 블록 레벨 스코프, 함수 레벨 스코프를 설명했는데 전역 스코프와 지역 스코프는 무엇인가?

 

아래 내용을 보며 살펴보도록 하자

전역 스코프

변수가 함수 바깥이나 {} 바깥 에서 선언되었다면, 전역 스코프에 정의된다.

let a = 'aa'

위의 a는 어디에서나 접근 가능하다.

 

변수를 글로벌 변수로 선언했을 경우, 이는 전역 스코프에 정의된다고 알 수 있다.

 

let a = 'first'
let a = 'second' // 이미 선언되어있음

전역 스코프에서 중복 재할당의 문제가 발생할 수 있으므로 주의해야 한다.

 

지역 스코프

지역 스코프는 특정 영역에서만 사용할 수 있는 변수이다.

지역 스코프는 다음과 같이 2가지로 이루어진다

  • 함수 레벨
  • 블록 레벨

함수 레벨 스코프

function a(){
  var b = 2;
}

위와 같이 선언했을 때, b는 함수 a에서만 사용할 수 있다.

함수 레벨 스코프는, 함수 내에서만 사용 가능한 변수를 의미한다.

 

함수 내에서 선언된 변수는 함수 내에서만 유효하며 함수 외부에서는 참조할 수 없다.

즉, 함수 내부에서 선언한 변수는 지역 변수이며 함수 외부에서 선언한 변수는 모두 전역 변수이다.

 

블록 레벨 스코프

블록 내부에서 const, let으로 변수를 선언한다면, 이 변수들은 블록 내부에서만 사용이 가능하다.

{
  const a = 'hello world'
  console.log(a) // 'hello world'
}
console.log(a) // Error, a is not defined

모든 코드 블록(함수, if 문, for 문, while 문, try/catch 문 등) 내에서 선언된 변수는 코드 블록 내에서만 유효하다.

따라서 코드 블록 외부에서는 참조할 수 없다.

 

즉, 코드 블록 내부에서 선언한 변수는 지역 변수이다.


정리하자면 javascript는 ES5까지는 함수 레벨 스코프만 제공했으나,

ES6부터는 let, const를 이용해 블록 레벨 스코프 선언이 가능하다.

 

const를 먼저 사용하자. 재할당해야 하는 경우가 생기면 let을 사용한다.

 

var는 block scope를 지원하지 않기 때문에 되도록 사용하지 말자

 

+ Recent posts