[ES6+] chaining Promises 여러개의 프로미스

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

amISexy.then(number => console.log(number));
//2

프로미스를 사용하면 이렇게 결과가 나온다는건 배웠는데 만약 프로미스가 하나가 아니라 여러개라면?

그때는 그냥 then을 여러개 이어주면 된다

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

amISexy
	.then(number => {
  	console.log(number * 2);
	})
	.then(otherNumber => {
  	console.log(otherNumber * 2);
	})

그런데 이렇게 명령하면

4까지는 잘 나오는데 8이 나와야 하는 곳에는 NaN이 뜬다.

왜냐면 otherNumber가 undefined이기 때문!

이 이유는 then을 여러개 이어붙이려면 바로 전에서 값을 받아와야하는데

첫번째 then에서 return값이 없기 때문이다.

그래서,

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

amISexy
	.then(number => {
  	console.log(number * 2);
  	return number * 2;
	})
	.then(otherNumber => {	//otherNumber는 number * 2와 같다
  	console.log(otherNumber * 2);
	})

//4 8

예시코드

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

const timesTwo = number => number * 2;

amISexy
.then(timesTwo)
.then(timesTwo)
.then(timesTwo)
.then(timesTwo)
.then(timesTwo)
.then(()=>{
  throw Error("something is wrong");
})
.then(lastNumber => console.log(lastNumber))
.catch(error => console.log(error));

노마드코더의 ‘ES6의 정석’을 듣고 정리 =)

예시코드

Share this post