[Javascript]Promise - resolve, reject

길현민·2022년 8월 21일
0

Javascript

목록 보기
6/14

Promise

  • Promise는 비동기 동작을 처리하기 위해 ES6에 도입되었다. (처음엔 혁명 느낌)
  • Promise는 클래스다.
  • Promise 클래스를 인스턴스화 해서 promise 객체를 만든다.
  • 반환된 promise로 원하는 비동기 동작을 처리한다.
  • Promise는 일단 stateresolve, reject 함수를 이해하면 된다.

Promise 구현하기

let promise = new Promise(function(resolve, reject) {
	// 여기 비동기 로직을 작성!
	// 시켜놓고 언제 완료될지 모르는 로직!
});
  • resolve는 비동기 로직이 성공했을 때 실행할 함수
  • reject는 비동기 로직이 실패했을 때 실행할 함수

resolve 이해하기

let promise = new Promise(function(resolve, reject) {
	// 여기 비동기 로직을 작성!
	// 시켜놓고 언제 완료될지 모르는 로직!

	// 완료 하면 -> resolve 호출
  // 비동기 동작 실패 하면 -> reject 호출
});

promise.then(function() {
	// 이 함수가 바로 위의 resolve 입니다.
	// 위의 비동기 로직이 성공하면 호출 됩니다!
});

예제


let promise = new Promise(function(**resolve**, reject) {
    setTimeout(function() {
				// resolve 함수에 인자 넘기면
        **resolve('hello world');**
    }, 2000);
});

// resolve 호출시 전달되는 인자 → then 콜백함수의 매개변수로 받는다.
promise.then(**function(msg) {
    console.log(msg);  // 2초 뒤에 hello world!
}**);

reject 이해하기

let promise = new Promise(function(resolve, **reject**) {

});

// then 인자 둘 다 cb 함수
// 첫 번째는 성공했을 때 실행할 resolve 함수 정의
// 두 번째는 실패했을 때 실행할 reject 함수 정의
promise.then(function() {}, **function() {}**);
let promise = new Promise(function(resolve, reject) {
	setTimeout(function() {
				// 실패한 건 아니지만, 실패했다고 가정하고 reject 호출
				// 보통은 api를 호출하고 응답 에러가 났을 때 reject를 호출하죠.
        **reject('으악!');**
  }, 2000);
});

promise.then(function() {
	console.log('resolve');        // 여기는 실행이 안 되고
}, **function(msg) {
	console.log('reject', msg);    // 여기만 실행됨! "reject 으악!"
}**);

주의


let promise = new Promise(function(resolve, reject) {
    setTimeout(function() {
        resolve(1);
        resolve(2);
    }, 1000);
});

promise.then(function(msg) {
    console.log(msg);
});
  • 첫 번째 resolve 만 실행됨
let promise = new Promise(function(resolve, reject) {
    setTimeout(function() {
				reject(1);
        resolve(2);
        resolve(3);
    }, 1000);
});

promise.then(function(msg) {
    console.log('resolve', msg);
}, function(msg) {
    console.log('reject', msg);
});
  • 첫 번째 reject 만 실행됨

🐔출처

위코드

profile
맛집탐방러

0개의 댓글