Promise
- promise는 언제 데이터를 받아올지는 모르지만 프로미스를 사용하면 데이터가 준비되는 대로 등록한 콜백함수를 불러주는 약속이다.
- resolve, reject 라는 콜백함수를 사용하지 않으면 계속 pending 상태로 남는다.
- 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있다.
Promise는 다음 중 하나의 상태를 가진다.
- 이행(fulfilled): 연산이 성공적으로 완료됨.
- 거부(rejected): 연산이 실패함.
대기 중인 프로미스는 값과 함께 이행할 수도, 어떤 이유(오류)로 인해 거부될 수도 있다. 이행이나 거부될 때, 프로미스의
then메서드에 의해 대기열(큐)에 추가된 처리기들이 호출된다. 또한 이행이 거부될때,catch메서드를 사용한다.
let myFirstPromise = new Promise((resolve, reject) => {
// 우리가 수행한 비동기 작업이 성공한 경우 resolve(...)를 호출하고, 실패한 경우 reject(...)를 호출.
setTimeout( function() {
resolve("성공!");
reject(new Error("Error!"));
}, 250)
})
myFirstPromise.then((successMessage) => {
// successMessage는 위에서 resolve(...) 호출에 제공한 값
console.log("와! " + successMessage) //와! 성공!
}).catch(error => {
console.log(error)
}).finally(() => {
console.log('종료!');
});
finally메서드: 이행과 거부에 상관없이 마지막 기능을 사용하고 싶을때 사용.
Promise APIs - all, race
all
- 배열 형태로 저장
- 주어진 모든 프로미스가 이행하거나. 한 프로미스가 거부될 때까지 대기하는 새로운 프로미스를 반환한다.
- 반환하는 프로미스가 이행한다면, 매개변수로 제공한 프로미스 각각의 이행 값을 모두 모아놓은 배열로 이행한다.
- 배열 중 하나라도 reject를 갖고 있으면 실패한다. 어떠한 데이터도 얻지 못함
race
- 가장 먼저 실행되는 것이 전달된다.
- 주어진 모든 프로미스 중 하나라도 처리될 때까지 대기하는 프로미스를 반환한다.
- 반환하는 프로미스가 이행한다면, 매개변수의 프로미스 중 첫번째로 이행한 프로미스의 값으로 이행한다.
Promise.all([f1(), f2(), f3()]).then(resolve => {
console.log((resolve));
});
Promise.race([f1(), f2(), f3()]).then(resolve => {
console.log((resolve));
});
Frontend Developer