const & let 변수, 스코프, 호이스팅

- 블록 단위 { }로 변수의 범위가 제한되었음

- const : 한번 선언한 값에 대해서 변경할 수 없음 ( 상수 개념 )

- let : 한번 선언한 값에 대해서 다시 선언할 수 없음

 

ES5 특징 - 변수의 Scope

- 기존 자바스크립트(ES5)는 { } 에 상관없이 스코프가 설정됨

// var
var sum = 0;
for( var i = 1; i <= 10; i++ ) {
	sum += i;
}
console.log(sum);	// 55
console.log(i);		// 11

// let
let sum = 0;
for( let i = 1; i <= 10; i++ ) {
	sum += i;
}
console.log(sum);	// 55
console.log(i);		// Uncaught ReferenceError: i is not defined

// const
const a = 1;
a = 2;	// Uncaught TypeError: Assignment to constant variable.

// 하지만, 객체나 배열의 내부는 변경 가능하다.
const a = {};
a.test = 10;
console.log(a);	// {test: 10}

const b = [];
b.push(20);
console.log(b);	// [20]

 

ES5 특징 - Hoisting

- Hoisting 이란 선언한 함수와 변수를 해석기가 가장 상단에 있는 것처럼 인신한다.

- js 해석기는 코드의 라인 순서와 관계없이 함수선언식과 변수를 위한 메모리 공간을 먼저 확보한다. 따라서, function() 과 var 는 코드의 최상단으로 끌어 올려진 것처럼 보인다.

// 함수 선언식
function print() {
	return "1";
}
print(); // "1"이 아니라 "2"가 출력된다. 이유는 Hoisting 때문이다.
function print() {
	return "2";
}

// 함수 표현식 
var print = function() { 
	return "1"; 
} 
print(); // "1"이 출력된다. 함수선언식과 변수에서 Hoisting이 일어난다.
var print = function() { 
	return "2";
}