티스토리 뷰

반응형

Promise는 ES6에 내장된 기능이다. 콜백과 비슷하지만 문법적으로 더 다루기가 쉽다.

 

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

 

 

만드는 방법

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    console.log("work");
    resolve(); 
  }, 1000);
});

비동기로 실행해야할 코드가 있다면 Promise 안에 넣은 후 준비 가 됐을때 resolve를 실행 시키면 된다.

에러가 난 경우에는 reject를 식행 시키면 된다.

 

일반적으로 프로미스는 함수로 감싼후 프로미스를 리턴 시킨다.

function asyncFun() {
  let error = false;
  const promise = new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("work");
      if (error) {
        reject(); 
      } else {
        resolve();
      }
    }, 1000);
  });
  return promise;
}

혹은

function asyncFun() {
  let error = true;
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("work");
      if (error) {
        reject(); 
      } else {
        resolve();
      }
    }, 1000);
  });
}

사용 할 때는 then을 이용한다.

asyncFun().then(
  () => console.log("complete!"),
  () => console.log("error!")
);

then의 첫번째 인자는 resolve가 실행 됐을 때 실행 되고

두번째는 reject가 실행 됐을때 실행 된다.

 

 

 

let promise = Promise.reject("error");

let promise2 = Promise.resolve("done");

이런식으로 바로 reject, resolve를 즉시로 사용 할 수도 있다. 이 경우에는 자동으로 promise가 리턴되어 

promise.then()... 이런식으로 연결이 바로 가능하다.

 

예제)

let promise = Promise.reject("error!");

promise.then(()=>{},err => console.log(err));

error! 출력

(then에서 각 함수가 받는 인자는 resolve 혹은 reject로 넘긴 값이다.)

 

 

'Javascript > 비동기 프로그래밍' 카테고리의 다른 글

Promise 활용1  (0) 2020.04.10
[Javascript] Promise #3 promise.all, promise.race  (0) 2020.04.09
[Javascript] Promise #2  (0) 2020.04.08
[Javascript] callback 활용방법  (0) 2020.04.07