setTimeout(() => {
console.log("타임아웃 1");
}, 0);
Promise.resolve().then(() => console.log("프로미스 1"));
setTimeout(() => {
console.log("타임아웃 2");
}, 0);
Promise.resolve().then(() => console.log("프로미스 2"));
// 프로미스 1 프로미스 2
// 타임아웃 1 타임아웃 2
위와 같이 태스크 큐에 담기는 setTimeout 보다 잡 큐에 담기는 Promise 가 먼저 실행된다.
// 콜백 함수는 resolve, reject 두 인자를 받음
let promise = new Promise((resolve, reject) => {
// promise 실패 시 reject 호출
if (Math.random() < 0.5) {
return reject("실패")
}
// promise 성공 시 resolve 호출
resolve(10)
})
promise
// 성공 시 실행
.then(data => {
console.log("성공: ", data)
})
// 실패 시 실행
.catch(e => {
console.log("실패 : ", e)
})
// 성공과 실패 여부 상관없이 실행
.finally(() => {
console.log("promise 종료")
})
then
/catch
메소드가 또 다른 promise를 리턴하여 비동기 코드에 순서를 부여할 수도 있다. 함수를 호출한 주체가 함수를 끝낸 뒤 자기 자신을 리턴하도록 하여 구현한다.
이렇게 동일한 객체에 메소드를 연결할 수 있는 것을 체이닝(chaining)이라 한다.
promise
.then(data => {
return fetchUser(data)
})
.then(user => {
console.log('User : ', user)
})
.catch(e => {
console.log("실패 : ", e)
})
Promise
.resolve(10)
.then(console.log)
Promise
.reject("Error")
.catch(console.log)
// 10
// Error
Promise.all([
promise1,
promise2,
promise3
])
.then(values => {
console.log("모두 성공 : ", values)
})
.catch(e => {
console.log("하나라도 실패 : ", e)
})