8. [ES6] 변수

이번 포스팅에서는 JavaScript의 ES6에서 개정된 변수에 대해서 학습해 보도록 하겠습니다. 

 

변수란? 

: 데이터를 임시 저장하는 박스 (var, let, const) 

아래에 제시된 3가지의 개념에 대해서 알아야 한다.  

 

1. 변수의 선언 

var 테스트; // 테스트라는 박스를 만들겠다. (선언)

 

2. 변수의 할당 

테스트 = 20; // 아까 테스트라고 만든 박스에 20을 넣을거야! (할당)

 

3. 변수의 스코프(scope, 범위) 

 

 

변수의 스코프

var의 scope는 함수 단위  let, const의 scope는 블록 단위

 

그림에 의미를 두지 말고 블록스코프가 조금 더 좁은 의미라는 것을 이해해 두면 편합니다. 

 

1. var 는 함수 내부에 선언된 변수만 지역변수로 인정하며 나머지는 전부 전역변수로 처리한다. 

2. let과 const 는 중괄호가 들어가있는 모든 스코프 내의 변수들을 지역변수로 인정하고 처리한다. 

 

        if(true){
            let let_test = 'let'; // 지역 변수로 취급됨 
            var var_test = 'var'; // 전역 변수로 취급됨
        }
        console.log(var_test); //var
        console.log(let_test); //let_test is not defined

 

let은 블록스코프 내에서 선언 했으면 블록내에서만 작동 (지역 변수)

var는 함수스코프 내에서 선언하지 않으면 전역변수로 인정되기 때문에 쓸 수 있다.  

 

☞ var 의 이러한 특성은 나중에 에러를 불러올 수 있는 유발인자이기 때문에 ES6문법에서 개정 되어 나온 것

 

예시 1. 

함수에서 var 선언 ☞ var는 지역 변수로 선언되었기 때문에 함수 이외의 공간에서 사용 불가능

function test() {
  var 나이 = 26;
}

console.log(나이); // 에러

 

예시 2.

전역에서 변수를 선언하고 함수에서 변수 호출 ☞ var 나이가 전역 변수에서 선언되었기 때문에 함수 내에서 사용 가능

var 나이 = 25;

function test() {
  console.log(나이); // 25
}

 

 

변수 정리 테이블

                                                   지역 변수

var	함수 스코프	재선언 O	재할당 O
let	블록 스코프	재선언 X	재할당 O
const	블록 스코프	재선언 X	재할당 X

 

▶ var : 재선언이 가능한 변수를 만들 때, 범위 : 함수 스코프(함수 내에서만 지역변수, 나머지는 모두 전역변수)

 

▶ let : 재선언이 불가능 (에러방지용), 범위 : {}, 블록 스코프내에서는 모두 지역변수 

 

▶ const : 재선언 불가능 & 재할당 불가능, 범위 : {}, 블록 스코프내에서는 모두 지역변수