Skip to content

Latest commit

 

History

History
125 lines (90 loc) · 4.63 KB

Block_Scope(Let, Const).md

File metadata and controls

125 lines (90 loc) · 4.63 KB
Raw

[ES6] Block_Scope(Let, Const)

자바스크립트는 기본적으로 함수기반 스코프를 가진다. 그러나 ES6에 들어가면서 새로운 스코프가 더 생기게 된다. 바로, Block scoping

Block scoping 에 대한 정보를 찾으면 항상 같이 나오는 것이 let과 const이다.

Block scoping은 let, const와 같이 나오는 것은 맞다고 생각한다.

기본의 자바스크립트의 스코프는 함수기반 스코프이다.

즉, 함수 스코프에 따라 결정이 되는 방식이라는 것이다. 블록방식 따위는 필요없다는 것이다. 그래서 전역에서 조건문, 반복문의 블록스코프따위는 깔끔하게 무시하고 전역에 달라붙는 것이다.

(모든 것은 var의 경우)


if(true){
    var a = '1';
    console.log(a);// 1
}
console.log(a); // 1
if(true){
    let a = '1';
    console.log(a); // 1 
}
console.log(a); // Uncaught ReferenceError: a is not defined

let은 변수가 선언된 블록, 구문 또는 표현식 내에서만 유효한 변수를 선언한다. 이는 var 키워드가 블록 범위를 무시하고 전역 변수나 함수 지역 변수로 선언되는 것과 다른 점이다.

아래와 같은 방법도 스코프가 적용이 된다.

let a = "b"
console.log(a); // b
{
   let a = "a"
   console.log(a); // a
}

console.log(a); // b
var a = "b"
console.log(a); // b
{
   var a = "a"
   console.log(a); // a
}

console.log(a); // a


기존의 var 키워드의 특성

  1. 함수 레벨 스코프(Function-level scope)
    1. 전역 변수의 남발
    2. for loop 초기화식에서 사용한 변수를 for loop 외부 또는 전역에서 참조할 수 있다.
  2. var 키워드 생략 허용
    1. 의도하지 않은 변수의 전역화
  3. 중복 선언 허용
    1. 의도하지 않은 변수값 변경
  4. 변수 호이스팅
    1. 변수를 선언하기 전에 참조가 가능하다.


Let

  1. 블록 레벨 스코프(Block-level scope)

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

  1. var 키워드로는 이름이 같은 변수를 중복해서 선언할 수 있었지만, let 키워드로는 이름이 같은 변수를 중복해서 선언하면 문법 에러(SyntaxError)가 발생한다.


호이스팅

var 키워드로 선언된 변수와는 달리 let 키워드로 선언된 변수를 선언문 이전에 참조하면 참조 에러(ReferenceError) 가 발생한다. let 키워드로 선언된 변수는 스코프의 시작에서 변수의 선언까지 일시적 사각지대(Temporal Dead Zone; TDZ) 에 빠지기 때문이다.

var 키워드로 선언된 변수는 선언 단계와 초기화 단계가 한번에 이루어진다. 즉, 스코프에 변수를 등록(선언 단계)하고 메모리에 변수를 위한 공간을 확보한 후, undefined 로 초기화(초기화 단계)한다. 따라서 변수 선언문 이전에 변수에 접근하여도 스코프에 변수가 존재하기 때문에 에러가 발생하지 않는다. 다만 undefined 를 반환한다. 이후 변수 할당문에 도달하면 비로소 값이 할당된다. 이러한 현상을 변수 호이스팅(Variable Hoisting) 이라 한다.

let 키워드로 선언된 변수는 선언 단계와 초기화 단계가 분리되어 진행된다. 초기화 이전에 변수에 접근하려고 하면 참조 에러(ReferenceError) 가 발생한다.

따라서 스코프의 시작 지점부터 초기화 시작 지점까지는 변수를 참조할 수 없다. 스코프의 시작 지점부터 초기화 시작 지점까지의 구간을 일시적 사각지대(Temporal Dead Zone; TDZ) 라고 부른다.

let 키워드로 선언된 변수를 전역 변수로 사용하는 경우, let 전역 변수는 전역 객체의 프로퍼티가 아니다. 즉, window.foo 와 같이 접근할 수 없다. let 전역 변수는 보이지 않는 개념적인 블록 내에 존재하게 된다.

Const

  1. let 은 재할당이 가능하나 const 는 재할당이 금지된다.
  2. 블록 레벨 스코프를 가진다.
  3. 상수는 가독성과 유지보수의 편의를 위해 적극적으로 사용해야 한다.
  4. 객체의 프로퍼티는 보호되지 않는다. 재할당은 불가능하지만 할당된 객체의 내용(프로퍼티의 추가, 삭제, 프로퍼티 값의 변경)은 변경할 수 있다. Reference이기 때문

참고