JavaScript

• 공통점 : var / let / const 는 모두 변수 선언 시 사용
• 차이점 : 사용 범위(Scope)
               var : function-scope
               let, const : block-scope
• 부가 설명
  : var는 변수 '재선언 가능'처럼 유연성이 매우 좋지만
     그에 따라 부작용도 많았다. 그래서 ES6부터 let과 const가 등장했다.
               (호이스팅 문제도 등장의 배경이 된다. 아래에 나옴!)

---

[ var ]

• 함수 스코프 (function-scope)
  : function 블록만을 범위로 인정
    전역 함수 외부에서 생성한 변수는 모두 전역변수!
• 재선언 가능

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

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

---

[ let, const ]

• 블록 스코프(block-scope)
   : if, while, for, function 등의 {}(중괄호)
     코드 블록 내부에서만 유효

{
 {
   let name = 'kjw'
   const pw = '12345'
 }
  console.log(name) // name is not defined
  console.log(pw) // pw is not defined
}

• let과 const의 차이는 'immutable' 여부!
  ◆ 재할당 가능(let)

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

  name = 'jujube0'
  console.log(name) // jujube0

   ◆ 재할당 불가(const) + 선언 시 초기화 필수!

  const name = 'kjw' // 선언 시 초기화 필수!
  console.log(name) // kjw
  name = 'jujube0' // error!!

호이스팅(Hoisting)

[개념]

• hoist는 "끌어 올리다" 라는 뜻을 가지고 있다.
• 변수 선언 위치에 상관 없이 사용될 수 있도록 '최상위'로 올려주는 것

---

[이해]

• 모든 변수는
  선언(declaration) / 초기화(initialzation) / 할당(allocation) 과정을 거침
  -var는 '선언'과 '초기화'가 항상 같이 된다.
  -let은 '선언'과 동시에 '초기화' 하는 경우에만 같이 수행 된다.

 var number // 선언 + 초기화
 number=1234 // 값 할당

 let number // 선언
 number=5678 // 초기화 + 할당

• var는 선언+초기화가 항상 동시에 일어나기 때문에 호이스팅 으로 인해
  전역변수(global variable)가 되어 코드가 안좋게 된다.
  (전역변수의 남발은 코드를 복잡하게한다.)

(function() {
  for(i=0; i<10; i++) {
    console.log('i', i)
  }
})()
console.log('after loop i is', i)

이 코드는 아래와 같이 인식된다.

var i // 전역 변수가 된다! (호이스팅 되어서)
(function() {
  for(i=0; i<10; i++) {
    console.log('i', i)
  }
})()
console.log('after loop i is', i)

[정리]

: 따라서 변수를 선언할 때 let과 const로 사용하는 것이 좋다.
  가변 적인 값 = let
  불변 적인 값 = const

• 추가적으로 let과 const도 호이스팅이 가능하다(block scope로!)
  자세한 내용은 참조 바람.
  (https://gist.github.com/LeoHeo/7c2a2a6dbcf80becaaa1e61e90091e5d)