1. JavaScript의 역사

• JS는 웹페이지를 만들 때 쓰는 언어?
  → 브라우저에서 해석 가능한 언어

각 브라우저마다 JS를 해석하는 엔진이 다르다.

자바스크립트 엔진

• Internet Explorer - Chakra
• Firefox - SpiderMonkey
• Chrome - V8
  
  
  
  

1) ECMAScript ( 1997年~ )

• ECMA International에서 만든 표준화된 프로그래밍 언어
  즉, 자바스크립트를 표준화하기 위해 만든 언어!

구글 크롬 등장 이전, IE가 웹 브라우저 시장의 90% 이상을 차지
→ ECMAScript 표준을 무시하며 JS 생태계 파괴
→ 구글 Chrome의 강력한 퍼포먼스를 지닌 V8 엔진이 등장하면서 JS 생태계 안정화됨!

ES6 ( ES2015 )

• 1997년 시작된 ECMAScript의 6번째 버전
• class, let & const, arrow function, promise 등 많은 변화
• → ES2015 이후의 자바스크립트를 ES2015+라고 표현하기도 함
  
  
  

2) JavaScript

• 스크립트 언어 ( =인터프리터 언어 )
• 코드를 한 줄씩 번역하고 실행
• 타입 명시 X
• 프로토타입 기반의 객체 지향 언어

2. 변수 선언법

	var	let	const
범위	Function	Block	Block
변수 재선언	⭕	❌	❌
변수 값 재할당	⭕	⭕	❌
초기화 값 필요	❌	❌	⭕

1) Function Scope

• 유효 범위: 함수 범위 내
• 전역 함수 외부에서 생성한 변수는 모두 전역(global) 변수

	// test.js

	...

	let globalVariable; // 전역 변수

	function globalFunction() { // 전역 함수
	  	...
	}

    	...

2) Block Scope

• 블록의 범위: 중괄호 { } 사이
  ex) if, while, for, function 등
  
• 함수 스코프에서 발생하는 호이스팅 문제 해결 가능
  
  

  호이스팅 (Hoisting)

• 자바스크립트는 선언'만'을 함수의 최상위로 끌어올림(hoist)
  ex) var x = "var";(선언 + 할당)을
  var x;(선언)과 x = "var"(할당)으로 분리하여 선언부만 유효 범위 내 최상단으로 끌어올림
• 변수선언부뿐만 아니라 함수선언식 역시 호이스팅 대상
• 예시

// 작성한 JS 코드

hoistFunction();

function hoistFunction() {
    console.log(x)
    var x = "var";
    console.log(x)
}

---

// JS 엔진이 해석한 코드

function hoistFunction() {
    var x;
    console.log(x)
    x = "var";
    console.log(x)
}

hoistFunction();

---

// 실행 결과

undefined
var

코드의 가독성과 유지보수를 위해 호이스팅은 최대한 발생하지 않도록 해야함

💡 var 대신 let, const를 사용!
💡 함수와 변수를 가급적 코드 상단부에서 선언!