변수의 선언 방식
var
변수 선언 및 초기화 후에 값을 재할당할 수 있다.
동일한 변수명으로 중복 선언이 가능하다.
let
var의 단점(중복 선언) 을 보완하기 위해 ES6(ECMAScript6) 에서 새로 등장한 변수 선언 방식이다
변수 선언 및 초기화 후에 값을 재할당할 수 있다
동일한 변수명으로 중복 선언이 불가능하다.
const
let 과 동일하게 ES6(ECMAScript6) 에서 새로 등장한 변수 선언 방식이다.
let 처럼 동일한 변수명으로 중복 선언이 불가능하다. (에러가 발생함.)
let 과 다른 점은 변수를 처음에 한 번 선언하고 나면 값을 넣을 수 없다.
- 값을 재할당하는 것이 불가능하다.
- 보통 상수를 선언하는 키워드로 사용된다.
하지만 이 중 var는 이미 선언된 변수를 다시 선언할 수 있기 때문에 현재는 사용하지 않는 변수 선언 방식입니다. 이러한 문제는 javascript에서 호이스팅이라는 개념이 있기 때문입니다.
호이스팅
호이스팅이란 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다.
쉽게 말해서 호이스팅은 변수의 선언과 초기화를 분리하여 선언만 코드의 최상단으로 끌어올려주는 것입니다. 따라서, 변수를 정의하는 코드보다 사용하는 코드가 앞서 등장할 수 있습니다.
함수의 호이스팅
함수는 코드를 실행하기 전에 함수 선언에 대한 메모리부터 할당되어 함수를 호출하는 코드를 함수 선언 앞에 배치할 수 있습니다.
catName('클로이')
function catName(name) {
console.log('제 고양이의 이름은' + name + '입니다')'
}
// '제 고양이의 이름은 클로이입니다'이러한 특징 때문에 const를 사용한 화살표형 함수 선언 방식을 통해 예상하지 못한 에러를 방지할 수 있습니다. 왜냐하면 const도 호이스팅이 되긴 하지만 undefined로 초기화 하지 않기 때문에 선언전에 먼저 사용하게 되면 오류가 발생하게됩니다.
catName('클로이')
const catName = (name) => {
console.log('제 고양이의 이름은' + name + '입니다')'
}
// Uncaught ReferenceError: catName is not defined변수 var의 호이스팅
console.log(num); // 호이스팅한 var 선언으로 인해 undefined 출력
var num; // 선언
num = 6; // 초기화변수 선언 시 초기화를 제외한 선언만 호이스팅합니다. 변수를 먼저 사용하고 그 후에 선언 및 초기화가 나타나면 사용하는 시점의 변수는 기본 초기화 상태인 undefined입니다.
let과 const로 선언한 변수도 호이스팅이 되긴 하지만, var와는 달리 undefined로 변수를 초기화 하지 않기 때문에 변수 선언 전에 먼저 사용하게되면 오류가 발생합니다.
