$.Deferred의 기본 사용
21285 단어 jquery
$.Deferred
콜백 함수를 보다 잘 구분하기 위해 jquery 내부에서 Deferred 객체에 함수를 등록하고 호출하는 세 가지 방법을 정의합니다.
타입
등록!
호출
성공 상태
$.Deferred.done(fn)
$.Deferred.resolve
실패 상태
$.Deferred.fail(fn)
$.Deferred.매개 변수
진행 상태
$.Deferred.progress(fn)
$.Deferred.notify (매개 변수)
본질적으로done과fail의 원리는 같다. 함수 이름을 통해 더욱 잘 구분하기 위해서이다. 성공과 실패의 리셋 함수는 프로그레스와 구별된다. 프로그레스 상태의 함수는done이나fail의 리셋 조건에 도달할 때까지, 프로그레스 상태의 함수는done이나fail의 리셋 조건에 도달할 때까지, 현재의 리셋 임무를 중지한다.
사례:
<script>
//
var master = function(){
console.log(' ')
}
var good = function(){
console.log(' ')
}
var loser = function(){
console.log(' ')
}
// deferred
var deferred = $.Deferred()
//
deferred.done(master)
//
deferred.fail(loser)
//
deferred.progress(good)
// ,
var timer = setInterval(function(){
var num = Math.random()*100
if(num > 85){
//
deferred.resolve()
}else if(num < 60){
//
deferred.reject()
}else{
//
deferred.notify()
}
},1500)
</script>
상기 사례의 deferred 대상은 전역적이고resolve,reject,notify는 전역적으로 직접 호출될 수 있기 때문에 이것은 불합리하다.resolve,reject,notify 이 세 개의 트리거 함수는 반드시 특정한 조건에서만 호출할 수 있기 때문에, 외부 등록 함수만 허용하고 호출 함수는 허용하지 않습니다.케이스 변경 사항은 다음과 같습니다.
<script>
//
var master = function(){
console.log(' ')
}
var good = function(){
console.log(' ')
}
var loser = function(){
console.log(' ')
}
var asyn = function(){
// deferred
var deferred = $.Deferred()
// ,
setInterval(function(){
var num = Math.random()*100
if(num > 85){
//
deferred.resolve()
}else if(num < 60){
//
deferred.reject()
}else{
//
deferred.notify()
}
},1500)
return deferred.promise()
}
// promise
var deferred = asyn()
//
deferred.done(master)
//
deferred.fail(loser)
//
deferred.progress(good)
</script>
등록 함수 쓰기 간소화:then
원래:
//
deferred.done(master)
//
deferred.fail(loser)
//
deferred.progress(good)
단순화:
// : , ,
deferred.then(master,loser,good)
체인 호출then
// :
deferred.then(master,loser,good)
.then(fn1,fn2,fn3)
.then(fn1,fn2,fn3)
체인 호출의 전제는 지난then이promise 대상을 되돌려주는 것이다.
사례:
<script>
//
var master = function(){
console.log(' ')
return asyn()
// promise
}
var good = function(){
console.log(' ')
return asyn()
// promise
}
var loser = function(){
console.log(' ')
return asyn()
// promise
}
var asyn = function(){
// deferred
var deferred = $.Deferred()
// ,
setInterval(function(){
var num = Math.random()*100
if(num > 85){
//
deferred.resolve()
}else if(num < 60){
//
deferred.reject()
}else{
//
deferred.notify()
}
},1500)
return deferred.promise()
}
// promise
var deferred = asyn()
deferred.then(master,loser,good).then(master,loser,good)
//
</script>
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
jQuery 전후 예이 기사에서는 jquery after() 및 before() 메소드의 예를 볼 것입니다. before() 메서드는 선택한 요소 앞에 지정된 콘텐츠를 삽입합니다. after() 메서드는 선택한 요소 뒤에 지정된 콘텐츠...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.