Point!
1. State: process가 수행 중인지, 성공했는지, 실패했는지
2. producer와 Consumer의 차이점을 이해하자
// 새로운 promise가 만들어 질 때, executor 함수가 바로 실행된다.
const promise = new Promise((resolve, reject) => {
// 무거운 일을 할때나 시간이 꽤 걸리는 작업을 할 때
// 동기적으로 처리를 하면 다음 라인의 코드가 실행되지 않는다.
// network, read files - 비동기 처리
console.log('doing something...');
setTimeout(() => {
resolve('lee');
// reject(new Error('no network'));
}, 2000);
});
promise
// then은 promise가 정상적으로 잘 수행이 되었을 때,
// resolve라는 콜백함수를 통해 전달한 값이 value로 간다.
.then(value => {
console.log(value);
})
// error가 발생했을 때, 어떻게 처리할 건지 콜백함수를 등록해 준다.
.catch(error => {
console.log(error);
})
// 성공과 실패에 무관하게, 출력하게 된다.
.finally(() => {
console.log('finally');
});
const fetchNumber = new Promise((resolve, reject) => {
setTimeout(() => resolve(1), 1000);
});
fetchNumber
.then(num => num * 2)
.then(num => num * 3)
.then(num => {
return new Promise((resolve, reject) => {
setTimeout(() => resolve(num - 1), 1000);
});
})
.then(num => console.log(num));
const getHen = () =>
new Promise((resolve, reject) => {
setTimeout(() => resolve('🐓'), 1000);
});
const getEgg = hen =>
new Promise((resolve, reject) => {
// setTimeout(() => resolve(`${hen} => 🥚`), 1000);
setTimeout(() => reject(new Error(`error! ${hen} => 🥚`)), 1000);
});
const cook = egg =>
new Promise((resolve, reject) => {
setTimeout(() => resolve(`${egg} => 🍳`), 1000);
});
getHen() //
// .then(hen => getEgg(hen))
// 한 가지만 받아오는 경우엔 생략 가능하다.
.then(getEgg)
// getEgg에서 문제를 해결하고 싶으면, 바로 아래 catch 처리를 해주면 된다.
.catch(error => {
return `🥖`;
})
.then(cook)
.then(console.log)
.catch(console.log);
출처
'드림코딩'님의 프로미스 개념부터 활용까지