자바스크립트 비동기 프로그래밍을 위한 Promise 사용하는방법

안녕하세요.

오늘은 자바스크립트에서 비동기 프로그래밍을 더욱 편리하게 할 수 있도록 도와주는 Promise 기술에 대해서 알아보겠습니다.

비동기 프로그래밍이란?

• 비동기 프로그래밍이란, 쉽게 예를들어보면 3가지 일을 해야한다고 할 경우에, 한가지 일을 하면서 다른일도 동시에 하는 것을 의미합니다. (동시처리)
• 동기적 프로그래밍이란 그 반대로, 한가지일을 차례차례 하는 것을 의미합니다. (1번 일 먼저 처리 > 2번 일 처리 > 3번 일을 처리)
• 생활코딩 영상에 쉽고, 간단하게 설명되어 있습니다. ^^
  - https://opentutorials.org/course/2136/11884

Promise란?

• Promise는 자바스크립트에서 콜백 로직을 편하게 사용할 수 있도록, 간편화한 것을 말합니다.
  - 전통적인 콜백 패턴은 오류나 예외처리를 하기 힘들고, 여러개의 비동기 로직을 처리하는데도 한계가 있습니다.
• 이 개념은 E 언어에서 처음 고안됐으며 병렬 및 병행 프로그래밍을 위한 일종의 디자인입니다.
• Promise 라고 부르는 하나의 인터페이스를 이용해 다양한 비동기 처리 문제를 해결할 수 있습니다.
• 쉽게 말해 복잡한 비동기 처리를 쉽게 패턴화 할 수 있습니다.

Promise의 간단한 개념

• Constructor
  - Promise는 XMLHttpRequest처럼 생성자 함수에 new 연산자를 선언하여 promise 인스턴스 객체(이하 promise 객체)를 생성해 사용한다. 
  
  

  var promise = new Promise(function(resolve, reject) { // 비동기 처리 작성
  // 처리가 끝나면 resolve 또는 reject를 호출한다.

  }); 

  
  
• Instance Method
  -  new 연산자로 생성한 Promise의 인스턴스 객체에는 성공(resolve) 또는 실패 (reject)했을 때 호출될 콜백 함수를 등록할 수 있는 promise.then()이라고 하는 인스턴스의 메서드가 있다. 
  
  
• Static Method
  - 전역 객체인 Promise에는 Promise.all()이나 Promise.resolve() 같은 정적 메서드가 있다. 이 메서드는 Promise를 다루는 데 필요한 보조 메서드다. 
  

Promise 간단한 사용방법

// 비동기 함수 정의

function asyncMethodPromise() {
    return new Promise(function (resolve, reject) {
        //비동기 처리 로직 작성
    });
}

// 비동기 함수 사용 방법 1 
asyncMethodPromise().then(function success(response) {
    //비동기 함수 성공
}
, function error(error) { 
    //비동기 함수 실패
});

// 비동기 함수 사용 방법 2
asyncMethodPromise()
    .then(function (response) {
        //비동기 함수 성공
    })
    .catch(function (error) {
        //비동기 함수 실패
    });

참조

• 생활코딩 동기vs비동기, https://opentutorials.org/course/2136/11884
• 한빛 Javascript_promise (도서)