[Javascript] 변수 var, let, const 차이점

    var
        함수 범위에서 유효(function scope)
        재선언, 재할당 모두 가능 >> 개발자 간의 오류 발생 가능성을 높이므로 사용 지양

        - 키워드 생략 허용   >> 의도치 않은 전역화를 발생시킴
        - 중복 선언 허용     >> 의도치 않은 값 변경
        - 호이스팅 적용 대상 >> 선언 이전 참조 가능이라는 비정상 코드를 발생시킴

    let
        블록 범위에서 유효(block scope)
        재선언 불가
        재할당은 가능
        변수 사용전까지 초기화되지 않음(선언과 초기화의 분리 >> 호이스팅 적용이 안됨)

    const
        블록 범위에서 유효(block scope)
        재선언, 재할당 모두 불가
        선언시 반드시 값이 할당되어야 하는 상수 변수(초기화하지 않으면 에러)
        보통 대문자를 사용해서 선언되나 강제사항은 아님(ex. const NUM = 8;)

 

JavaScript 호이스팅은 인터프리터가 코드를 실행하기 전에 함수, 변수, 클래스 또는 임포트(import)의 선언문을 해당 범위의 맨 위로 끌어올리는 것처럼 보이는 현상을 뜻합니다.
출처 : https://developer.mozilla.org/ko/docs/Glossary/Hoisting

 

var name = '창섭';
console.log(name);	// 창섭
var name = '현식';
console.log(name);	// 현식

let name = '창섭';
console.log(name);	// 창섭
name = '현식';
console.log(name);	// 현식

const disp = document.querySelector("#disp");
const btn = document.querySelector("#btn");