ES6 :: ECMAScript6

ECMAScript

• 자바스크립트를 표준화하기 위해서 만들어진,
  Ecma 인터내셔널의 ECMA-262 기술 규격에 정의된 표준화된 스크립트 프로그래밍 언어이다.
• ES6은 2015년에 발표되었다.

ES6의 새로운 문법

template literal

• 백틱으로 감싸 문자열을 표현한다.
• 백틱 내부에 플레이스 홀더${변수}를 사용해서 문자열과 표현식을 함께 쓸 수 있다.

const / let

• const: 변경이 불가능한 변수(상수)를 선언하기 위한 키워드
• let: 재할당이 가능한 변수를 선언하는 키워드
  ES5 이하 문법에서는 var로 선언된 변수가 호이스팅 되는 현상이 있었다.
  ES6에서는 이러한 호이스팅이 일어나는 side effect를 최소화하기 위해서, 변경 가능한 변수는 let으로 정의한다.

화살표 함수

• function 키워드 없이 함수를 만들 수 있다.
• return 키워드 없이 반환할 수 있다.
• this는 함수가 선언된 스코프에 자동 바인딩 된다.

비구조화 할당

• 객체와 배열로부터 프로퍼티를 쉽게 꺼낼 수 있다.

const obj = {
  scchool: "swu",
  name: "juhee",
  age: 26,
};

let { school, name, age } = obj;

for-of

• 특정 행위를 반복시켜 결과값을 얻어야 할 때 사용한다.
• 반복 가능한 객체를 for문 안에서 반복시켜 연속된 결과를 얻는다.

const iterable = [10,20,30];

//ES5
for(let i=0; i<iterable.length; i++){
  console.log(value);
}
👇🏻
//ES6
for (const value of iterable){
	console.log(value);
}

Spread 연산자

• 특정 객체 또는 배열의 값을 다른 객체나 배열로 복제하거나 옮길 때 사용한다.
• react에서 state의 특정 부분만 변화시키거나, 최초의 상태를 유지하며 데이터를 추가하는 경우에 사용한다.

Default Parameter

• 파라미터의 default값을 미리 지정할 수 있다.

const foo = (a, b = "b", c = "c") => {
  console.log(a, b, c);
};

foo("a");
//a b c