기존 자바스크립트 ES5 문법으로도 prototype을 이용해서 객체 지향 프로그래밍을 할 수 있었다.

전에 프로토타입, 프로토타입체인을 공부하면서 정리해놓은게 있는데 다시 재정리 해본다

프로토타입 기반 언어
모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미
프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수도 있고 그 상위 프로토타입 객체도 마찬가지이다
이를 프로토타입 체인(prototype chain)이라 부르며 다른 객체에 정의된 메소드와 속성을 한 객체에서 사용할 수 있도록 하는 근간이다

Classes

Class는 객체를 생성하기 위한 템플릿이다
클래스는 데이터와 이를 조작하는 코드를 하나로 추상화하며, 자바스크립트에서 클래스는 프로토타입을 이용해서 만들어졌지만 ES5의 클래스 의미와는 다른 문법과 의미를 가진다

Class 정의

Class는 사실 "특별한 함수"입니다. 함수를 함수 표현식과 함수 선언으로 정의할 수 있듯이 class 문법도 class 표현식 and class 선언 두 가지 방법을 제공한다

class 선언은 프로토타입 기반 상속을 사용하여, 주어진 이름의 새로운 클래스를 만든다

즉, 기존에 없던게 아니고 자바스크립트에 있던 프로토타입을 이용하여 class라는 키워드를 사용할 수 있는 것이다

대표적인 Syntactic sugar의 예로
문법적 기능은 그대로인데 그것을 읽는 사람이 직관적으로 쉽게 코드를 읽을 수 있게 만든다는 것 즉, 문법적 설탕, 문법적 허용 ? 으로 생각하면 편할 듯 하다

async, await

위와 같이 async, await도 Syntactic sugar의 대표적인 예로 볼 수있다

함수 앞에 async 키워드를 추가하면 Promise를 반환한다
async 기능의 특징 중 하나이며,
실제로는 fulfil Promise가 반환되기 때문에 반환된 값을 사용하기 위해선 .then() 블럭을 사용해야 한다

• Promise를 동기식으로 코드를 순서대로 작성하는 것처럼 간편하게 작성을 도와주는 API
• async & await는 새롭게 추가된 것이 아니라, 기존에 존재하는 Promise 위에 조금 더 간편한 API를 제공하는 것
  (왜 async가 syntactic sugar인지 보여주는 예)
• Promise chaning을 계속 사용하다보면 가독성이 떨어지기 때문에 async & await를 사용하면 읽기 좋은 코드를 작성할 수 있다

async

• promise를 간편하게 쓸 수 있는 syntactic sugar
• 오래 걸리는 일을 비동기적으로 처리하지 않으면 JavaScript 엔진은 동기적으로 코드를 수행하기 때문에 그 코드가 끝날 때까지 다른 코드를 실행하지 않는다.
  따라서 비동기적으로 처리하기 위해 promise를 사용
• promise에서 resolve, reject를 호출하지 않으면 promise의 상태는 pending (진행중)으로 남아 있게 된다. 따라서 promise에서는 반드시 resolve나 reject를 호출해서 성공 또는 실패의 상태로 만들어야 결과를 볼 수 있다

함수 앞에 async를 붙여주면 자동적으로 함수가 promise로 변환된다

await

• await 함수는 async가 붙은 함수 안에서만 사용 가능하다

await 병렬 처리

await을 여러 개 쓰다보면 하나의 await을 처리한 후, 다음 await을 처리하는데 두 함수가 서로 연관이 없다면 매우 비효율적이다. 이 때 promise 함수를 이용하면 바로 바로 함수가 실행될 수 있게 만들 수 있다.
await 함수들이 동시에 기다렸다가 한 번에 출력이 가능해진다