FrontEnd/ES6
02. const & let
hanseom
2021. 9. 4. 10:35
반응형
const & let은 새로운 변수 선언 방식입니다. ES5는 Hoisting으로 인해 변수의 유효범위(Scope)가 {}에 상관 없이 설정되지만, ES6는 {} 단위로 변수의 유효범위(Scope)가 설정됩니다.
1. const
const는 한번 선언한 값에 대해서 변경할 수 없는 상수입니다. 하지만, 객체나 배열의 내부는 변경할 수 있습니다. 아래 코드의 obj 객체의 num이란 속성 추가가 가능하며, arr 배열에 요소를 추가(push)하거나 빼낼(pop) 수 있습니다.

2. let
let은 값 변경이 가능한 변수입니다. 다만, 한번 선언한 값에 대해서 다시 선언할 수 없습니다.

3. ES5 Hoisting
Hoisting(끌어 올리기)이란 js해석기가 코드의 라인 순서와 관계 없이 함수선언식과 변수를 위한 메모리 공간을 먼저 확보함으로 가장 상단에 있는 것처럼 인식하는 것입니다.

단, 함수표현식은 대상이 아닙니다.

원본 코드 | 실행 순서 |
var num1 = 10; function sum() { num1 = num1 + num2; } var num2 = 20; |
var num1; function sum() { } var num2; num1 = 10; num1 = num1 + num2; num2 = 20; |
4. ES5 vs ES6
ES5 변수의 유효범위(Scope)는 {}에 상관없이 설정됩니다.

ES6 변수의 유효범위(Scope)는 다른 언어와 통일성을 유지하기 위해 {}에 제한됩니다.

반응형