var와 let, const의 차이

❗함수의 객체를 보고싶다면 console.dir로 보면된다.

var, let, const란?

변수를 선언할 때 사용하는데

var test = 'test';
let test = 'test';
const test = 'test';

var는 기존부터 있었고, let과 const는 ES6문법이다.

차이점은?

1. 재할당 재선언 가능여부

1-1. var는 재할당 재선언 다 가능하다.

재할당

var test = 'test';
test = 'start';
console.log(test);  // start

재선언

var test = 'test';
var test = 'start';
console.log(test);  // start

1-2. let은 재할당은 가능하지만 재선언은 불가능하다.

재할당

let test = 'test';
test = 'start';
console.log(test);  // start

재선언

let test = 'test';
let test = 'start';
console.log(test);  // SyntaxError

1-3. const는 재할당, 재선언 다 불가능하다.

재할당

let test = 'test';
test = 'start';
console.log(test); // TypeError

재선언

let test = 'test';
let test = 'start';
console.log(test);  // SyntaxError

범위

var는 함수 단위의 스코프이다.

function functiontest() {
  var a = 100;
  if(true) {
    console.log(a);
  }
  console.log(a);
}

functiontest(); // 100, 100;

let과 const는 블록 단위 스코프이다.

let과 const는 {} 블록 단위로 사용 가능하다.

function blocktest() {
  if(true) {
    let b = 100;
    console.log(b);
  }
  console.log(b);
}

blocktest(); // 100, Uncaught ReferenceError: b is not defined;

function blocktest() {
  if(true) {
    const b = 10;
    console.log(b);
  }
  console.log(b);
}

blocktest(); // 10, Uncaught ReferenceError: b is not defined;

var는 최대한 지양하고
const를 기본으로 사용하고 재할당을 해야할때만 let을 사용한다.