변수 선언 방식 (var, let, const)

JS에서 변수 선언 방식은 var, let, const 세가지가 있다.

 

 

 

• var (variable)

재선언, 재할당이 가능하다.

var kimchi = "김치"
console.log(kimchi)    // 김치
var kimchi = "총각"
console.log(kimchi)    // 총각

 

 

똑같은 변수를 다시 선언해도 오류가 나지 않고 변수에 할당된 값도 변경할 수 있다.

 

 

 

• let 

재선언은 불가하고 재할당은 가능하다.

let it = "go"
let it = "go~"
// SyntaxError: Identifier 'it' has already been declared

 

이미 it 이 선언되었다고 오류가 나온다.

 

let it = "go let"
it = "go"

선언된 it에 "go let" 을 할당해놓고 나중에 "go" 를 재할당 해주었다.

 

 

 

• const

재선언, 재할당 모두 불가하다.

const antine = "Keanu Reeves"
const antine = "안돼"
// SyntaxError: Identifier 'antine' has already been declared

이미 선언 되어있다고 오류 발생

 

 

const antine = "Keanu Reeves";
antine = "GoGilDong";
// TypeError: Assignment to constant variable.

상수 변수에 할당 했다고 오류 발생

 

 

var와 let과 또 다른점은 var와 let은 선언만 해두고 할당하지 않아도 상관없지만

const는 선언과 함께 할당까지 하지않으면 오류가 난다.

const antine
antine = "콘스탄틴";
SyntaxError: Missing initializer in const declaration

---

• 호이스팅 (Hoisting)

호이스팅은 var, function 선언문 등을 해당 스코프의 선두로 옮긴 것 처럼 동작하는 특성

ES6에서 도입된 모든 선언(var, let, const, function, function*, class)을 호이스팅한다.

 

 

 

변수 생성단계는 선언 단계 > 초기화 단계 > 할당 단계 에 걸쳐 생성되는데

var로 선언된 변수와 let으로 선언된 변수를 선언 이전에 참조하면 다른 결과가 나타난다.

console.log("밤맛 아이스크림 : ",vavamvar);
var vavamvar;

// 밤맛 아이스크림 :  undefined

var 는 오류없이 변수 안에 undefined 가 들어있다고 나왔고

console.log("커피음료", letsbe);
let letsbe;

// ReferenceError: letsbe is not defined

let 은 참조오류로 변수가 정의되지 않았다고 나온다.

 

이건 let이 생성과정이 var와 달라서 나타나는 것인데

 

 

 

var는 선언할 때 선언단계와 초기화단계가 한번에 이루어지고

let은 선언할 때 선언단계만 이루어진 상태이기때문에 

 

var는 선언만 했을 때 초기화된 변수가 호이스팅에 의해 먼저 읽히므로 선언되고 할당은 안된 상태인 undefined가 나왔고

let은 초기화 단계가 진행되지 않아 아직 변수선언지 되지 못했기 때문에 정의가 되지 않았다고 나온듯 하다.

 

 

---

 

 

 

세가지 다 한번 선언하고 그대로 사용하는것에는 문제가 없으나 재선언, 재할당에 차이가 있어

필요에 따라 사용할 변수 선언 방식을 골라서 사용하면 된다.

근데 대부분의 경우 재할당을 하는 경우도 드물 뿐더러 재선언을 하는 경우는 있을까 싶다.

그래서 기본적으로 const를 사용하고 재할당이 필요하다면 그 때 되서 let으로 변경하면 될 것 같다.