JAVASCRIPT ES

ES란 ECMA(European Computer Manufacturers Association) Script의 약자로 AVASCRIPT의 표준 규격을 의미

ES5에서 변경된 ES6

1. arrow function 지원

• ex6에서 this.name, this.age 값을 가져올 수 있게 됨

2. template literals

• ex6에서 백틱을 사용하면 문자열 데이터를 플레이스 폴더(${val})를 사용하여 백틱 내부에 문자열과 함께 표현식을 넣을 수 있다

3. 변수 선언방식

• ex6에서 블록 레벨 스코프를 따르는 변수를 선언하기 위해 let, const가 추가됨

4. module

• import/export로 모듈로 각 기능별로 JS파일을 나누고 개발 관리 가능

5. class

• new 키워드로 class 생성가능
• constructor() 생성자 함수로 속성 설정 가능
• 메서드 정의, 상속, 부모 메서드 호출 가능한 Class를 사용

6. promise 도입

• 비동기를 위한 객체, 어떤 일의 진행 상태를 나타내는 객체로 상태와 값이라는 속성을 갖고 있다. resolve, reject를 호출하여 진행 상태를 결정할 수 있다 promise의 값은 resolve, reject를 호출할 때 넘긴 인자에 의해 결정된다. then(), catch()는 일의 진행 상태를 나타내는 객체다. promise가 fullfilled일 때 then()에 등록한 함수를 실행하고, promise가 rejected일 때는 아무것도 하지 않는다

---------- ES6 (promise) ----------
const isEvenNumber = (num) => {
  return new Promise((resolve, reject) => {
    if (num % 2 === 0) {
      resolve(true);
    } else {
      reject(false);
    }
  });
};
isEvenNumber(10).then((result) => {
  console.log('even number');
}).catch((error) => {
  console.log('odd number');
});

7. Destructuring(구조 분해할당)

var a, b, rest;
[a, b] = [10, 20];
console.log(a); // 10
console.log(b); // 20

[a, b, ...rest] = [10, 20, 30, 40, 50];
console.log(a); // 10
console.log(b); // 20
console.log(rest); // [30, 40, 50]

({ a, b } = { a: 10, b: 20 });
console.log(a); // 10
console.log(b); // 20

// Stage 4(finished) proposal
({ a, b, ...rest } = { a: 10, b: 20, c: 30, d: 40 });
console.log(a); // 10
console.log(b); // 20
console.log(rest); // {c: 30, d: 40}