var, const, let - 자바스크립트의 변수

0. Java Script Version

• ECMAScript(줄여서 ES, 이크마스크립트)의 버전에 따라서 결정, 자바스크립트 실행 엔진이 반영
• 자바스크립트 엔진은 작성한 JS 코드를 한 줄씩 해석하면서 실행을 준비
• ES5, ES6(ES2015)..
• ES6는 ES5문법을 포함, 하위호환성 문제가 없음
  (feature별 미지원 브라우저 존재, 주의)
• Bable
  ES6 미지원 구 버전 브라우저를 위한 transpiling이 필요
  ES6 > ES5로 변환 컴파일러
  Babel 온라인 에디터: https://babeljs.io/repl/

1. var의 단점을 보완하기 위한 ES6의 let, const

var 재선언 O & 재할당 O & function-scoped
let 재선언 X & 재할당 O & block-scoped
const 재선언 X & 재할당 X & block-scoped

2. Hoisting

함수 내부에 있는 선언을 내부적으로 해당 함수 유효 범위의 최상단에 끌어올림
1) 자바스크립트 parser가 함수 실행 전 해당 함수의 전체 범위를 점검
2) 함수 내부에 존재하는 변수/함수 선언에 대한 정보를 기억

var, 함수 선언문에만 적용
변수 선언이 함수 선언보다 우선
값이 할당되지 않은 변수보다 함수 선언이 우선

😒코드의 가독성과 유지보수를 위해 Hoisting 최소화 필요

📃 Reference
자바스크립트의 변수, 연산자 및 타입의 종류와 개념
자바스크립트의 Hoisting
JavaScript-var-let-const-차이점