const , let란 (var 넌 나가있어) --ES6

ES6 이전에는 변수를 선언하는 방법이 var로 정해져있었습니다.

하지만 ES6 이후 const와 let이 나오면서 var의 문제점을 해결할 수 있었습니다.

그렇다면 var의 문제점은 무엇일까요?

😲 var의 문제점

1. 변수 선언 시 var 키워드 생략 가능

color = 'blue';
console.log(color)  //blue로 결과값 나옴

2. 같은 변수 여러번 선언 가능

var color = 'blue';
var color = 'red';

console.log(color);  //red 결과값

같은 변수를 선언하여도 오류 없이 동작하는 것을 볼 수 있습니다.

3. 함수 외부에서 선언된 모든 변수는 전역 변수

var color = 'blue';

{
    color = 'red';
}

console.log(color); //red

function pink () {
    var colorPink = 'pink';
}

console.log(colorPink); //error

위에서 보듯이 var는 함수에서 사용하는 { }(중괄호)만 scope로 인정하기 때문에 전역 변수가 남발하는 문제가 생길 수 있습니다.

4. 호이스팅

console.log(color);  //undifiend
var color = 'blue';

이런 것도 가능합니다. 찾아본 결과 변수 호이스팅(hoisting)으로 인한 문제라고 하는데

여기서 변수 호이스팅이란 코드에 선언된 변수 및 함수를 코드 상단으로 끌어올리는 것을 말합니다.

그렇다면 호이스팅은 왜 문제가 될까요?

호이스팅은 변수의 초기화가 아닌 선언부분만 끌어올리기때문에 초기화값이 없어도 에러가 나지 않고 undifiend라고 로그가 찍힙니다.

(var color(선언부분) = 'blue'(초기화부분))

---

var의 문제를 해결하기 위해 ES6에 등장한 변수 선언자가 const 와 let 입니다!

📃 let & const

1. 같은 변수 선언시 문법 error

let color = 'blue';
let color = 'red';

console.log(color);  //error

2. 변수 호이스팅 금지

console.log(color);    //error: color is not defined
const color = 'blue';

const와 let의 차이

const name = 'jiwon';
name = 'won';     	//error

let color = 'blue';
color = 'green';

console.log(color); //green

let은 var처럼 선언 후 초기화한 값을 재할당할 수 있습니다.

하지만 const는 한 번 초기화한 값은 다시 재할당할 수 없습니다.

---

참고자료
const
let