1220 / 비동기 처리 패턴 promise

PROMISE

fetch('https://www.google.com') // fetch 는 promise객체를 리턴
.then((response) => response.text()) // then는 promise 객체의 메소드
.then((result) => {console.log(result);});

promise 3가지 상태

pending - 진행중

fulfilled - 성공

rejected - 실패.

response를 정상적으로 받았을 때 fulfilled 상태가 된다

-> 그때 response 콜백이 실행

promise 객체이 작업 성공 결과는 첫번째 파라미터로 넘어옮.(response)

 

---

promise Chaining

비동기작업을 순차적으로 실행할때 전체 코드를 깔끔하게 하기 위해서 ?

 

fetch('https://jsonplaceholder.typicode.com/users')
.then((response) => response.text(), (error) => {console.log(error);})
.then((result) => {console.log(result);})

//(error) => {console.log(error);}) -> promise객체가 rejected상태가 되면 실행할 콜백
//promise객체가 rejected 상태가 되었을 때 실행할 콜백을 설정하고 싶으면 then 메소드의 2번째 파라미터로 원하는 콜백을 넣어줌
//두번째 파라미터는 작업 실패 정보가 넘어간다.

 

 

1. 실행된 콜백이 어떤 값을 리턴하는 경우

• promise 객체인 경우
  • 첫번재 then 메소드가 리턴했던 promise 객체는 respomse 객체의 json 메소드가 리턴한 promise 객체가 추후에 갖게되는 상태와 결과를 그대로 따라서 갖게된다.
  • -> 콜백에서 리턴하는 promise 객체를 then 메소드가 그대로 리턴한다. 

• promise 객체 이외의 값인 경우
  • fetch 함수의 작업이 실패햇을 때 두번째 콜백인 try again 이 실행, 두번째 콜백은 try again 리턴
  • -> 해당 콜백을 등록한 then 메소드가 리턴했던 promise 객체가 fulfilled상태가 되고 작업 성공 결과로 try again   문자열을 갖는다
   

---

promise 객체 생성

const p = new Promise((resolve, reject) => {
});
//resolve파라미터는 생성될 promise 객체를 fulfilled 상태로 만들 함수가 연결
//reject파라미터는 생성될 promise 객체를 rejected 상태로 만들 함수가 연결

-> p라는 promise 객체가 2초 후에 fulfilled가 된다는 의미

-> resolve 안에 넣은 success가 작업 성공의 결과

-> reject 함수를 넣었을때, 에러객체 출력

Promise 객체는 항상 결과를 줄 수 있는 공급자(Provider)이고 그것의 then 메소드는 그 결과를 소비하는 콜백인 소비자(Consumer)를 설정하는 메소드라