본문 바로가기

JavaScript

Promise

콜백 함수

function greeting(name) {
  console.log("Hello " + name);
}

function processUserInput(callback) {
  var name = "Please enter your name.";
  callback(name);
}

processUserInput(greeting);
// Hello Please enter your name

콜백 지옥 피라미드

doSomething(function(result) {
  doSomethingElse(result, function(newResult) {
    doThirdThing(newResult, function(finalResult) {
      console.log('Got the final result: ' + finalResult);
    }, failureCallback);
  }, failureCallback);
}, failureCallback);

Promise

- 콜백 지옥 피라미드를 피할 새로운 개념. 즉, Promise는 구조가 간단해 반환값을 찾아 사용하기 쉽다.

- 비동기 작업의 최종 완료 또는 실패를 나타내는 객체

 

- 기본적으로 promise는 함수에 콜백을 전달하는 대신에, 콜백을 첨부하는 방식의 객체

 

Promise는 다음 중 하나의 상태를 가진다.

  • 대기(pending): 이행하거나 거부되지 않은 초기 상태.
  • 이행(fulfilled): 연산이 성공적으로 완료됨.
  • 거부(rejected): 연산이 실패함

Promise.reject()

- 주어진 이유로 거부하는 Promise 객체를 반환.

 

Promise.resolve()

- 주어진 값으로 이행하는 Promise 객체를 반환. then 메서드가 있는 경우, 반환된 프로미스는 then 메서드를 따라가고 마지막 상태를 취한다. 그렇지 않은 경우 반환된 프로미스는 주어진 값으로 이행. 

 

예시

function create() {
  return new Promise((resolve, reject) => {
    reject();
    console.log("step1");
  });
}
create().then(
  () => {
    console.log("step3-succeed");
  },
  () => {
    console.log("step3-failed");
  }
);
console.log("step2");

결과

step1
step2
step3-failed

 

코드 설명

1. create() 호출

2. function  create() 의 reject()는 선언되었지만 실행되지 않음

3. console.log("step1") 실행

4. return을 통해 Promise 반환.

5. console.log("step2") 실행

6. then 내부에 작성된 function() 실행.

 

 

Reference

https://developer.mozilla.org/en-US/docs/Glossary/Callback_function

 

Callback function

A callback function is a function passed into another function as an argument, which is then invoked inside the outer function to complete some kind of routine or action.

developer.mozilla.org

https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Using_promises

'JavaScript' 카테고리의 다른 글

객체탐색과 배열탐색  (0) 2019.07.22
변수 선언  (0) 2019.07.22
jest  (0) 2019.07.22
generator function  (0) 2019.07.22
데이터  (0) 2019.07.17