Promise 는 비동기처리를 위한 비동기 연산 후 결과값이 실패를 처리 하기 위한 처리기를 연결 할 수 있도록 합니다.
초기의 Javascript는 동기(Sync)형태만 지원하였으나, 이후 계속 발전을 계속 하여 비동기(aSync)형태를 지원하기 시작했습니다. (대표적으로 Ajax 등등.)
이후 계속 발전하여 JQuery가 발표 되었고. 더 이상 Promise/Deferred를 사용하지 않고서는 웹을 구현하기 조차 어려워졌습니다.
Promise 는 Common JS Promises/A 에서 표준스펙으로 정의 되었습니다.
이런 표준스펙이 여러가지 플렛폼에 정의 됩니다.(JQuery, AngularJS, nodeJS 등등) JQuery에서는 Deferred로 정의 되었습니다.
Promise의 역사에 대해서는 차후에 좀 더 자세히 알아 보도록 하고, Promise가 무었인지에 대해 알아 보도록 하겠습니다.
우리가 가장 많이 사용한 ajax를 이용하여 이해도를 높혀 보도록 하겠습니다.
jQuery 1.5 이전
$.ajax({
url : '/getOTP'
, success : successFunction
, error : errorFunction
})초기에는 Ajax를 위와 같이 구현하였는데.
1.5 이후부터는 ajax를 promise 가 지원되어 아래와 같이 사용할 수 있게 되었습니다.
jQuery 1.5 이후
var p = $.ajax({
url : '/getOPT'
}
p.done(successFunction);
p.fail(errorFunction);또한 아래와 같이 코딩 할 수 도 있습니다.
jQuery 1.5 이후
var p = $.ajax({
url : '/getOPT'
})
p.done(successFunction1);
p.done(successFunction2);
p.done(successFunction3);
p.fail(errorFunction);
또는
$.ajax({
url : '/getOPT'
})
.done(successFunction1)
.done(successFunction2)
.done(successFunction3)
.fail(errorFunction);
이와 같이 chaincode 형태로 연결 할 수 도 있습니다.
이제 조금씩 이해가 가시죠?
그럼 어떻게 함수를 구현하면 done 또는 fail등을 이용할 수 있는지 알아 보도록 하겠습니다.
<Script>
$(document).ready(function() {
function doSendSMS()
{
var dfd = $.Deferred();
$.ajax({url:'./smssend.json'
, headers: {
'Content-Type': 'application/json'
}
})
.done(function(result){
//var j = JSON.parse(result);
//console.log(j.authno);
dfd.resolve(result);
})
.fail(function(x) {
//console.log(x);
dfd.reject(x);
});
return dfd.promise();
}
doSendSMS()
.done(function(x) {
console.log('SMS 인증 타이머 동작', x);
})
.fail(function(x) {
console.log('SMS 인증 타이머 재시도', x);
});
})
</Script>
이제 조금씩 이해가 가시죠? resolve 는 done으로 전달되고, reject는 fail로 전달 됩니다.
쉽게 deferred 를 promise()로 리턴하면, 터널이 생긴다고 보시면 됩니다. 이 후 비동기적으로 resolve/reject 가 터널을 통해서 결과가 전달 된다고 보시면 됩니다.
Promise 호환성 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise
1회는 여기서 마치고 2회를 곧 준비하여 돌아 오겠습니다.
to be continue...
