변수(Variable)는 (문자나 숫자 같은) 값을 담는 컨테이너로
값을 유지할 필요가 있을 때 사용한다. 여기에 담겨진 값은
다른 값으로 바꿀 수 있다.

1. 변수 선언 방식 3가지

변수는 var, const, let으로 선언 가능하다.

1-1. var

ES6 이전 버전에서는 var 변수를 주로 사용했다고 한다.
하지만 ES6 이후 버전에서부터는 var을 거의 사용하지 않는다고 하는데
그 이유가 var로 선언한 변수는 호이스팅(hoisting)이 일어나는 것이
그 이유라고 한다.

ex)
const k = won;
console.log(k);
// 일반적으론 변수를 먼저 설정하고
// 이후 출력하면 변수의 결과값이 나오는 것으로 알고있었다.

console.log(kang);
var kang = jiwon; 
//변수가 선언되지 않은 상태로 console로 출력하면 ReferenceError가 발생하는데
//var 변수는 먼저 설정하지 않았는데도 kang에 대한 결과값이 undifined가 나왔다.
//변수 설정이 안되어있으면 에러가 떠야 정상인데 말이다.

위의 예시처럼 변수를 먼저 설정하지 않았음에도
변수 선언이 이전에 된 것처럼 동작하는 현상을 호이스팅이라고 한다.
코드의 양이 많은데 변수가 어디서 선언된 지 모른다면 현업에서는
치명적인 결과(ex. YOU ARE FIRE)가 일어날 것이다.

호이스팅이 일어나는 var의 단점을 보완하여 만든 변수가
const와 let이다.

1-2. const와 let

둘의 차이점은 변수의 재할당 가능 여부이다.
둘 다 변수의 재'선언'은 불가능하다는 것이 공통점.
(쉽게 말해 변수의 뒤에 붙는 이름은 재활용이 안된다는 말이다.)
const는 변수의 재할당이 불가한 반면,
let은 변수의 재할당이 가능하다는 것이 차이점이다.

ex)
const ji = won;
console.log(ji); //won 출력

ji = kang;
console.log(ji); //TypeError 발생, 변수 재할당이 안된다.
--------------------------------------
let zip = gaza;
console.log(zip); //gaza 출력

zip = makchataza;
console.log(zip); //makchataza 출력, 변수 재할당 가능.

const는 어떤 상황에도 변하지 않을 변수를 설정할 때,
let은 값이 수시로 변하는 변수를 설정할 때 사용하는 것이 좋아보인다.
(default로 const를 쓴다고 알아두자)

2. 유효 범위(Scope)

작성하는 코드의 접근 범위를 결정하는 개념으로
변수 접근 규칙에 따른 유효 범위.

2-1 scopes 범위

전역 Scope

• 코드 기준 바깥 공간
• 어디서든지 참조할 수 있다.

지역 Scope

• 코드가 있는 지역 및 하위에 연결된 함수에서만 참조 가능
• 함수에 의해서만 지역 스코프가 생김

2-2 Scope의 특징

• 안쪽 scope에서 바깥쪽 scope로의 참조는 가능하지만
  반대는 불가능하다.

ex)
let name = "kang";

function home() {
let man = "jiwon";
return name + " " + man;
}
console.log(home()); //kang jiwon 출력, 안쪽에서 바깥의 변수를 참조 가능하다.
console.log(name); //kang 출력
console.log(man); // Uncaught ReferenceError 발생,
//바깥쪽에서 안쪽의 변수는 참조 불가능하다는 걸 알 수 있다.

• 전역 scope 가 아니라면 모두 지역 scope이다.
  ↓
  2.2 지역 scope에서 선언한 변수는 지역 변수,
  전역 scope에서 선언한 변수는 전역 변수라 한다.

• scope는 중첩이 가능하다.

• 지역 변수는 전역 변수보다 우선순위를 지닌다.

Reference
bigtop blog
생활코딩
Hanamon
poiemaWeb