프로미스와 프로미스체이닝

프로미스란?

Promise : 자바스크립트에 내장 된 객체로써 비동기적인 작업을 처리하기 위해 사용된다.
비동기적인 작업은 예를 들어 파일 로딩, 네트워크 요청 등이 있는데,
이러한 작업들은 모두 시간이 오래 걸릴 수 있기 때문에 프로미스를 사용한다.

1. producer

const promise = new Promise((resolve, reject)=>{
  console.log("프로미스는 생성 되면 executor가 자동으로 실행됩니다.");
  setTimeout(()=>{
  	resolve("성공");	//2초 뒤에 resolve 함수를 실행. 
    reject(new Error("에러가 발생한 이유를 적습니다."));
  },2000);
	})

* 프로미스를 만들면, 비동기 처리를 수행할 콜백 함수인 executor가 자동으로 실행된다.
* resolve는 코드가 성공적으로 처리 되었을 때 실행되는 함수이다.
* reject는 코드에 에러가 발생했을때 실행되는 함수이다.
(보통 new Error 함수를 실행하며 에러가 발생한 이유를 적어줘야한다.)

---------------------------------------------------------------------

2. consumers : then, catch, finally  

promise
  .then((resolveValue)=>{
	console.log(resolveValue);	//then의 인자로는 resolve의 인자가 전달된다.
})
  .catch((error)=>{
	console.log(error)	//catch의 인자로는 reject의 Error안의 인자가 전달된다.
})
  .finally(()=>{
	console.log("모든 작업이 끝났습니다")	//finally는 마지막에 무조건 실행되는 함수이다.
})

* then은 프로미스의 코드가 성공적으로 처리되었을 때 호출되며 resolve의 인자를 받아온다.
* catch는 프로미스의 코드가 에러가 발생했을때 호출되며 reject의 인자를 받아온다.

프로미스 체이닝

프로미스 체이닝은 .then을 활용해서 연속적인 비동기 처리를 수행하는 방법이다.
따라서 비동기 처리를 단계별로 나누어 각 단계에 필요한 처리를 수행할 수 있다.

아래는 임의의 fetch number를 출력하는 코드이다.

const fetch = new Promise((resolve, reject)=>{
	setTimeout(()=>{
	return resolve(1)
},1000);

// 위 코드 fetch는 1초 뒤에 then에 1을 넘겨주는 resolve 함수가 실행되는 프로미스이다.

fetch
.then(num => num * 2)	//최초 넘겨받은 1을 *2하여 2출력
.then(num => num * 3)	//넘겨받은 2를 *3하여 6출력
.then(num => {
	return new Promise((resolve, reject) => setTimeout( ()=>resolve(num - 1),1000 ))
}		//then은 값 뿐만 아니라 비동기 객체인 프로미스도 반환 가능하다.
		//즉, 또 다른 프로미스가 1초 뒤에 num에서 1을 빼는 resolve 함수를 실행한다.
.then(num => console.log(num));
		//마지막으로 넘겨받은 num을 출력한다.
		//5

이렇게 여러개의 then을 활용해서 각 단계별로 비동기 처리를 다르게 할 수 있는 방법이
프로미스 체이닝이다.