Deferred란?
각각의 비동기 처리에 Promise객체를 연계하여 그 상태를 전파하는 것으로
Promise를 구현한 jQuery 객체이다.
Promise는 IE에서 작동하지 않는다. Deferred는 브라우저 호환성의 편의성을 고려하여 만든 모듈이다.
또한 Deferred 객체는 내부의 Promise 객체를 반환하기 때문에 Promise와 동일하게 chaining이 가능하다.
Deferred의 3가지 상태
-
pending : 처리 중
-
resolved : 처리 성공
-
rejected : 처리 실패
Deferred의 처리 순서
function sleep(param) {
var deferred = $.Deferred();
// pending
setTimeout(function(){
param ? deferred.resolve("resolved!") : deferred.reject(new Error("Error occurred!")); // resolved & rejected
}, 2000);
return deferred.promise();
}
sleep(true)
.done(function(data) {
console.log(data);
})
.fail(function(error) {
console.log(error);
})
.always(function() {
console.log('always');
});
-
var deferred = $.Deferred(); :
$.Deferred()로 Deferred 객체를 생성한다. Promise 객체를 감싼형태로 생성한다.
-
deferred.resolve(“resolved!”); : Deferred 객체의 처리의 성공 상태를 변경한다. 성공메세지를 전달한다.
-
deferred.reject(new Error(“Error occurred!”) : Deferred 객체의 처리의 실패 상태를 변경한다.(에러객체를 전달)
-
return deferred.promise(); :
promise()로 Deferred 객체가 가지고 있는 Promise 객체를 반환한다.
done()
처리가 성공된 경우 resolved()로 상태를 변경하여 콜백함수인 done()함수가 실행된다.
fail()
처리가 실패된 경우 rejected()로 상태를 변경하여 콜백함수인 done()함수가 실행된다.
always()
Deferred 객체의 상태에 상관없이 항상 실행되는 콜백함수이다.
$.when() : 연속된 비동기 처리
$.when($.ajax('/example1'), $.ajax('/example2') )
.done(function( example1Result, example2Result ) { // 성공
// 결과내용
})
.fail(function() { // 실패
console.log('rejected');
});
$.when()을 사용하면 연속된 비동기 처리를 병렬적으로 수행할 수 있다.
$.when()안에 병렬적으로 수행할 비동기처리를 입력한다.
하나라도 실패할경우 fail()함수를 실행한다. 성공할 경우 결과 2개를 받아서 사용할 수 있다.