var, let, const 차이점

변수 선언 방식

 

var

 

var 변수는 선언 방식에 이성서 큰 단점을 가지고 있다.

 

    var name = 'bathingape'
    console.log(name) // bathingape

    var name = 'javascript'
    console.log(name) // javascript

 

같은 변수를 선언 했음에도 불구, 다른 값이 출력된다.

유연한 방식의 변수 선언이지만, 코드량이 많아지면 파악하기가 힘들고 값이 변경될 우려가 있다.

 

---

let

 

let으로 선언된 변수는 재 선언이 불가능하지만, 변수에 다른 값을 넣는 재할당은 가능하다.

 

    let name = 'bathingape'
    console.log(name) // bathingape

    let name = 'javascript'
    console.log(name) 
    // Uncaught SyntaxError: Identifier 'name' has already been declared

이미 선언된 변수라고 에러가 뜬다.

 

---

const

 

const 는 선언된 변수에 재할당, 재선언이 모두 불가능하다.

 

    const name = 'bathingape'
    console.log(name) // bathingape

    const name = 'javascript'
    console.log(name) 
    // Uncaught SyntaxError: Identifier 'name' has already been declared

    name = 'react'
    console.log(name) 
    //Uncaught TypeError: Assignment to constant variable.

 

이미 변수가 선언 되있다고 뜨며,

 

name에 값을 재할당이 불가능하다고 뜬다.

 

---

 

호이스팅

 

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

 

자바 스크립트 엔전은 코드를 실행하기 전 실행 컨텍스트를 위한 과정에서 모든

선언 var, let, const, function, class를 스코프에 등록한다.

 

(정확히는 var 키워드로 선언한 변수와 함수 선언문일 경우 오류 없이 동작한다.

- > 이것이 선언이 파일이 맨 위로 끌어올려진 것 처럼 보이게 함.)

 

변수의 생성 단계

 

선언 > 초기화 > 할당

 

• var - 선언 단계와 초기화가 한번에 진행
• let - 선언 단계와 초기화 단계가 분리되어 진행

---

참고

https://velog.io/@bathingape/JavaScript-var-let-const-%EC%B0%A8%EC%9D%B4%EC%A0%90

var, let, const 차이점

 

https://hanamon.kr/javascript-%ED%98%B8%EC%9D%B4%EC%8A%A4%ED%8C%85%EC%9D%B4%EB%9E%80-hoisting/

[JavaScript] 호이스팅(Hoisting)이란? - 하나몬