[Promises] Creating Promises

Promises는 뭐고 Promises를 어떻게 만드는지 알아보자.

 

Promise는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타낸다.

그래서 Promise를 만들 때는 실행할 수 있는 function을 넣어야 한다.

이 function은 예를 들어 forEach에서처럼 executor이다.

 

일단 Promise 안에 function을 만들어 보자

여기서는 arrow function을 이용할 것이다.

const amISexy = new Promise((resolve, reject) => {
  
});

resolve는 야, 이게 네 값이야. 자바스크립트로 돌아가!

reject는 야, 미안한데, 에러가 있어.

 

위의 amISexy를 console에 찍어보면

Promise가 pending 중이라고 나온다.

콘솔창에서 amISexy를 또 찍어보면 또 pending 중이라고 나온다.

자바스크립트가 이 파일의 실행을 끝내고, 우리가 새로운 Promise를 시작했고, 이 Promise가 끝나기를 기다리고 있는 것이다.

 

Promise를 어떻게 끝낼 수 있을까?

우리가 해야할 건 resolve function을 실행하는 것이다.

이게 Promise를 resolve 할 것이고, 우린 값을 가지게 되는 것이다.

 

아까 arrow function 안에서 Promise를 resolve 할 것이다.

const amISexy = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Yes you are!");
  }, 3000);
});

console.log(amISexy);

setInterval(() => {
  console.log(amISexy)
}, 1000);

 

amISexy 안에  3 초 후에 resolve 하는 timeout을 넣고, 아래에는 1초마다 amISexy를 불러내는 구현을 했다.

 

Promise의 핵심은, 우리가 아직 모르는 value와 함께 작업할 수 있게 해준다는 것이다.

이건 자바스크립트에서 야, 이걸 해줘. 이건 바로 안 될 거야. 이걸 하고, 끝나면 다시 알려줘.

그러니까 이게 끝나면, 이걸 다시 나한테 돌려줘.

 

우린 Promise에서 Yes you are!을 어떻게 꺼낼지 아직 보지 못했다.

 

Promise가 API를 호출하면 어떻게 될까?

Promise가 파일 시스템에서 파일을 연다면?

Promise가 유저의 설정을 연다면?

 

로딩이 다 되면 그걸 다시 JS에게 돌려줘야한다.