문제상황
만약 이러한 코드가 있다고 하면 각각의 실행 후 걸리는 총 시간은 18초가 될 것이다.
여기에서 3초와 6초를 비동기적으로 실행해서 동시에 종료하고 싶다면 다음처럼 Promise를 활용하면 된다.
await을 연달아 쓰지 말고 동시에 진행돼도 괜찮은 애들은 promise를 사용해서 동시에 실행하야함
우리는 항상 axios.get().then( () => {} )처럼 바로 then을 사용해버림
예시
게시물을 업로드하는 라우터를 작성한다고 생각해보자
이러한 코드가 있을 때
생각을 해보면 카운트 1 올리는 것과 새로운 게시믈 알림 등록은 동시에 진행되어도 괜찮은 코드
이를 해결하기 위해
다음처럼 p1과 p2는 동시에 진행 한 후 promise를 사용하는 것이 나음
이렇게하면 응답시간을 확실하게 줄일 수 있음
프로미스의 3단 흐름
delayP 함수가 저런 모양일 때
실행은 바로 --> 결과값이 나올 때는 나중 --> 결과값을 사용할 때는 더 나중
이러한 흐름을 갖는다 Promise 실행은 한번 훅 바로 됨
결과값을 사용할 때는 then이나 await을 붙였을 때
async/await를 promise로 바꾸기 2
*동기처리 유의
함수 b()를 프로미스로 바꿔볼려면
우선 동기부분을 파악해야한다. (첫 번째 await을 만나기 전)
동기부분을 파악 후 Promise에도 똑같이 동기처리를 해준 후
new Promise( (resolve, reject) => {
const p1 = delayP(3000); // 3초
const p2 = delayP(6000); // 6초
// 다음 넘어갈 값으로 return에 두 개의 처리 결과
return Promise.all([p1, p2]) // 6초
}.then( () => {
return delayP(9000);
})프로미스의 다양한 활용
다음과 같은 코드가 있을 떄 results를 활용하는 map에서는 p1, p2, p3의 실행순서를 보장해주지 않음 동시에 이루어짐
(물론 동시에 처리되는 것이 아니라 백그라운드에 보내져서 동시에 처리되는 것처럼 보이는 것)
만약 실행순서를 보장받고 싶다면 아래 처럼 for...of를 활용해야한다.
