Development/React

[ECMA Script6] 1. 변수 선언 (const, let, 템플릿문자열)

흥순 2019. 11. 23. 23:58

  ESC6 이전에는 변수를 선언하기 위해서는 var 키워드가 유일하였으나, ESC6 이후에는 더 나은 기능을 제공하는 몇가지 방법이 추가되었습니다.

1. const
   상수를 의미하는 const는 값을 변경 할 수 없는 상수 입니다.
   ESC6 이전에는 아래와 같이 변수를 선언하여 사용하였습니다.

1
2
3
var bCheck = true
bCheck  = false
console.log(bCheck) //false
cs

const 변수는 최초 생성 시 초기화된 이후, 값 재설정이 불가능합니다.
값을 재설정 하려고 하면  콘솔 오류가 발생합니다.

1
2
const bCheck = true
bCheck = false  // Error!!
cs

2. let
   자바스크립트 변수의 경우, 블록(중괄호 {})안에서 생성된 변수의 경우 해당 영역 안에서만 값이 유효하다고 생각될 수
   있으나 실상은 그렇지 못합니다. 
   호이스팅 관련 링크 :
https://yuddomack.tistory.com/entry/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%ED%98%B8%EC%9D%B4%EC%8A%A4%ED%8C%85Hoisting
   

   아래를 보시면, 글로벌 변수인 g_Text를 if문 블록안에서 동일 이름 변수로 선언 하였을 경우, 
   글로변 변수 값이 영향받는 것을 확인 하실 수 있습니다. 

1
2
3
4
5
6
7
8
var g_Text = "자바스크립트"
 
if(g_Text){
    var g_Text = "if문"
    consolg.log(g_Text) //if문
}
 
consolg.log(g_Text) //if문
cs

   

 아래와 같이 let 변수를 사용하면, 해당 블록에서만 영향을 미치며 글로벌 변수는 그대로 유지됨을 확인 할 수 있습니다.

1
2
3
4
5
6
7
8
9
 
var g_Text = "자바스크립트"
 
if(g_Text){
    let g_Text = "if문"
    consolg.log(g_Text) //if문
}
 
consolg.log(g_Text) //자바스크립트
cs