[JQUERY] jQuery를이 deferreds과 약속 -되는 .done 대) (그 때는 ()
JQUERYjQuery를이 deferreds과 약속 -되는 .done 대) (그 때는 ()
해결법
-
1.지연된가 해결 될 때 완료에 부착 된 콜백 ()가 발사됩니다. 지연된가 거부 될 때 () 실패에 부착 된 콜백은 해고 될 것입니다.
지연된가 해결 될 때 완료에 부착 된 콜백 ()가 발사됩니다. 지연된가 거부 될 때 () 실패에 부착 된 콜백은 해고 될 것입니다.
jQuery를 1.8 이전, 다음 () 단지 문법 설탕했다 :
promise.then( doneCallback, failCallback ) // was equivalent to promise.done( doneCallback ).fail( failCallback )
1.8로, 다음 ()가 파이프에 대한 별칭 () 반환 새로운 약속 () 파이프에 대한 자세한 내용은 여기를 참조하십시오.
성공 () 및 오류 ()는 아약스 호출에 의해 반환 된 jqXHR 객체 ()에서만 사용할 수 있습니다. 그들은 (완료) 각각) (실패에 대한 간단한 별칭 :
jqXHR.done === jqXHR.success jqXHR.fail === jqXHR.error
또한, () 단일 콜백에 한정되지 않고, (1.8.1에서 해결되어야 버전 1.8 문자열 버그가 존재하지만) 이외의 기능을 수행 걸러 :
// this will add fn1 to 7 to the deferred's internal callback list // (true, 56 and "omg" will be ignored) promise.done( fn1, fn2, true, [ fn3, [ fn4, 56, fn5 ], "omg", fn6 ], fn7 );
동일은 실패 간다 ().
-
2.반환 결과가 처리되는 방식의 차이도있다 (수행의 호출 체인은하지 않습니다 체인 다음 호출 체인을 생산하면서)
반환 결과가 처리되는 방식의 차이도있다 (수행의 호출 체인은하지 않습니다 체인 다음 호출 체인을 생산하면서)
promise.then(function (x) { // Suppose promise returns "abc" console.log(x); return 123; }).then(function (x){ console.log(x); }).then(function (x){ console.log(x) })
다음과 같은 결과가 기록 얻을 것이다 :
abc 123 undefined
동안
promise.done(function (x) { // Suppose promise returns "abc" console.log(x); return 123; }).done(function (x){ console.log(x); }).done(function (x){ console.log(x) })
다음을 얻을 것이다 :
abc abc abc
---------- 업데이트 :
BTW. 난 당신이 원자 유형 값 대신 약속을 반환하는 경우, 외부 약속은 내부 약속 결의 할 때까지 대기 한 얘기를 깜빡 했네요 :
promise.then(function (x) { // Suppose promise returns "abc" console.log(x); return $http.get('/some/data').then(function (result) { console.log(result); // suppose result === "xyz" return result; }); }).then(function (result){ console.log(result); // result === xyz }).then(function (und){ console.log(und) // und === undefined, because of absence of return statement in above then })
이 방법으로는 다음과 같은 병렬 또는 순차적으로 비동기 동작을 구성하기 위해 매우 간단해진다 :
// Parallel http requests promise.then(function (x) { // Suppose promise returns "abc" console.log(x); var promise1 = $http.get('/some/data?value=xyz').then(function (result) { console.log(result); // suppose result === "xyz" return result; }); var promise2 = $http.get('/some/data?value=uvm').then(function (result) { console.log(result); // suppose result === "uvm" return result; }); return promise1.then(function (result1) { return promise2.then(function (result2) { return { result1: result1, result2: result2; } }); }); }).then(function (result){ console.log(result); // result === { result1: 'xyz', result2: 'uvm' } }).then(function (und){ console.log(und) // und === undefined, because of absence of return statement in above then })
위의 코드 문제 병렬로 두 개의 HTTP 요청에 따라서 그 HTTP 요청을 아래로하여 서버의 부하를 감소 순차적으로 실행되는 동안 요청이 빨리 완료하고
// Sequential http requests promise.then(function (x) { // Suppose promise returns "abc" console.log(x); return $http.get('/some/data?value=xyz').then(function (result1) { console.log(result1); // suppose result1 === "xyz" return $http.get('/some/data?value=uvm').then(function (result2) { console.log(result2); // suppose result2 === "uvm" return { result1: result1, result2: result2; }; }); }); }).then(function (result){ console.log(result); // result === { result1: 'xyz', result2: 'uvm' } }).then(function (und){ console.log(und) // und === undefined, because of absence of return statement in above then })
-
3.되는 .done ()는 하나의 콜백을 가지고 있으며, 그것은 성공 콜백입니다
되는 .done ()는 하나의 콜백을 가지고 있으며, 그것은 성공 콜백입니다
그 때는 ()는 성공 및 실패 콜백을 모두 가지고
.fail ()는 하나의 실패 만 콜백을 갖는다
그래서 당신이 성공하면 신경 또는 실패하면 않습니다 ... 당신이해야 할 일을 당신에게 달려있다?
-
4.핸들러가 해결되는 경우에만 이연 호출 할 추가합니다. 여러 콜백이 호출 할 추가 할 수 있습니다.
핸들러가 해결되는 경우에만 이연 호출 할 추가합니다. 여러 콜백이 호출 할 추가 할 수 있습니다.
var url = 'http://jsonplaceholder.typicode.com/posts/1'; $.ajax(url).done(doneCallback); function doneCallback(result) { console.log('Result 1 ' + result); }
또한,이 같은 이상 쓸 수 있습니다
function ajaxCall() { var url = 'http://jsonplaceholder.typicode.com/posts/1'; return $.ajax(url); } $.when(ajaxCall()).then(doneCallback, failCallback);
아직 진행, 해결 이연 거부하거나 핸들러가 호출 될 추가합니다.
var url = 'http://jsonplaceholder.typicode.com/posts/1'; $.ajax(url).then(doneCallback, failCallback); function doneCallback(result) { console.log('Result ' + result); } function failCallback(result) { console.log('Result ' + result); }
-
5.꽤 중요한 차이점은 jQuery를 Deferreds이 약속 (및 jQuery를 버전 3.0 실제로 사양으로 그들을 데리고 시도)의 구현으로 의미하는 한, 사실이있다.
꽤 중요한 차이점은 jQuery를 Deferreds이 약속 (및 jQuery를 버전 3.0 실제로 사양으로 그들을 데리고 시도)의 구현으로 의미하는 한, 사실이있다.
수행의 주요 차이점은 / 그 다음이다
네이티브 ES2015 약속에 jQuery를으로부터 번역되는 .done ()는 정렬 체인이 "해결"상태 인 경우는,에 값을 합격으로 약속 체인 함수 주위의 "탭"구조를 구현 등이며 함수 ...하지만 그 함수의 결과는 체인 자체에 영향을 미치지 않습니다.
const doneWrap = fn => x => { fn(x); return x }; Promise.resolve(5) .then(doneWrap( x => x + 1)) .then(doneWrap(console.log.bind(console))); $.Deferred().resolve(5) .done(x => x + 1) .done(console.log.bind(console));
사람들은 모두 5,하지 (6) 기록합니다.
내가하지 그 때는, 로깅을 수행하기 위해 수행하고 doneWrap 사용합니다. CONSOLE.LOG 기능이 실제로 아무것도 반환하지 않기 때문이다. 그리고 무슨 일이 아무것도 반환하지 않습니다 그 때는 함수를 전달하면 어떻게됩니까?
Promise.resolve(5) .then(doneWrap( x => x + 1)) .then(console.log.bind(console)) .then(console.log.bind(console));
즉 기록합니다 :
어떻게 된 거예요? 내가 그 때는 사용하고 아무것도 반환하지 않았습니다 함수를 통과 할 때의 암시 적 결과는 물론 정의되지 않은 로그인 한 다음 다음 방법 [정의되지] 약속을 반환하는 ... "정의되지 않은"이었다. 우리는 기본적으로 손실 된 시작 원래 값 그래서.
그 때는 ()는, 중심부에, 함수 조성물의 형태이며, 각 단계의 결과는 다음 단계의 함수의 인수로서 사용된다. > 실제로 구성의 일부가 아니다 몰래 특정 단계에서의 값에 모습 그 값에서 함수를 실행하도록, 뭔가, 실제로 변경하지 않습니다 - 그게되는 .done는 "탭"과 같은 최고의 생각입니다 이유 어떤 방식으로하는 조성물.
이것은 매우 근본적인 차이이며, 기본 약속이되는 .done 방법은 자신을 구현하지 않아도 왜 아마 좋은 이유가있다. 베어 값을 반환 .catch에> 기능을하지 - 그게 훨씬 더 복잡하게 (즉, .fail /되는 .done / 그 때는의 거울이되지 않습니다 .catch 때문에 우리는 더 .fail 방법이 없습니다 이유에 들어갈 필요가 없습니다 전날 않습니다 그들이 해결 그 때는 전달 그들 같이 거부 "숙박"!)
-
6.다음 ()는 항상이 어떤 경우에 호출 될 것을 의미합니다. 그러나 전달하는 매개 변수는 다른 jQuery를 버전 다릅니다.
다음 ()는 항상이 어떤 경우에 호출 될 것을 의미합니다. 그러나 전달하는 매개 변수는 다른 jQuery를 버전 다릅니다.
이전 jQuery를 1.8, 다음 () 수행과 일치 한 (). 실패 (). 그리고 콜백 함수 모두 동일한 매개 변수를 공유 할 수 있습니다.
그러나 jQuery를 1.8로, 다음 () 새로운 약속을 반환하고 값을 반환하는 경우, 그것은 다음 콜백 함수에 전달됩니다.
하자 다음 예제를 참조하십시오
var defer = jQuery.Deferred(); defer.done(function(a, b){ return a + b; }).done(function( result ) { console.log("result = " + result); }).then(function( a, b ) { return a + b; }).done(function( result ) { console.log("result = " + result); }).then(function( a, b ) { return a + b; }).done(function( result ) { console.log("result = " + result); }); defer.resolve( 3, 4 );
jQuery를 1.8 이전에, 대답은해야한다
result = 3 result = 3 result = 3
모든 결과는 다음 3. 그리고 소요 () 함수는 항상 다음 함수 같은 연기 객체를 전달합니다.
그러나 jQuery를 1.8로, 결과는해야한다 :
result = 3 result = 7 result = NaN
제 첫 후 () 함수가 반환 새로운 약속, 값 7 (이것이 전달되는 유일한 파라미터이다) (다음 완료를 전달한다)로 인해, 제 완료되도록 () 기록 결과 = 7 후 ()은의 값으로 7을 취하고 (b)의 값이 정의되지 않은 소요 제 그럼 () 파라미터 NaN를 가진 새로운 약속을 반환하고) (마지막 완료 그 결과 NaN이를 출력한다.
-
7.다른 답변에서 찾을 조금 힘들었다 응답 매우 간단한 정신 매핑이 있습니다 :
다른 답변에서 찾을 조금 힘들었다 응답 매우 간단한 정신 매핑이 있습니다 :
-
8.쉽게 예상치 못한 동작이 발생할 수 있으며, 이전 답변에서 언급되지 않은 jQuery를 3.0로 또 하나 개의 중요한 차이가있다 :
쉽게 예상치 못한 동작이 발생할 수 있으며, 이전 답변에서 언급되지 않은 jQuery를 3.0로 또 하나 개의 중요한 차이가있다 :
다음 코드를 살펴 보자 :
D하자 = $ .Deferred (); d.done (() => CONSOLE.LOG ( '다음')); () d.resolve; 을 console.log ( '지금'); <스크립트 SRC = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"> script>
이 출력됩니다 :
then now
지금, 바로 그 코드에서) (다음 ()에 의해 수행 대체 :
VAR의 D = $ .Deferred (); d.then (() => CONSOLE.LOG ( '다음')); () d.resolve; 을 console.log ( '지금'); <스크립트 SRC = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"> script>
출력은 지금 :
now then
그래서, immediatly 해결 deferreds를 들어, 함수는 () 인수가 (다음에 전달 반면 항상 동기 방식으로 호출됩니다) 호출 비동기입니다 수행에 전달.
업그레이드 가이드에서 언급 한 바와 같이 모두 콜백은, 동 기적으로 호출되는 이전의 jQuery 버전이 다릅니다 :
-
9.이들은) (되는 .done의 단점입니다
이들은) (되는 .done의 단점입니다
내가 그 때는이 (oneArgOnly)는 항상 .catch를 필요로 일시적으로 생각 () 예외가 자동으로 무시하지만 더 이상 사실이 아니다됩니다 그래서 다음 unhandledrejection 이벤트 로그는 () (기본값) 콘솔에 예외 그 때는 처리되지 않은. 매우 합리적인! 이유가 전혀 ()되는 .done를 사용하는 것이 남아 있지.
다음 코드는, 계시한다 :
BTW,되는 .done ()에서 예외가 제대로 잡힐 수 없습니다 때문에되는 .done ()의 동기 패턴, 오류가 하나 .resolve의 지점에서 발생합니다 () (라이브러리 코드를 수 있습니다!) 또는시. 지연된가 이미 해결되었는지 범인을 첨부 () 호출을 수행.
을 console.log ( '스크립트의 시작.'); 하자 연기 = $ .Deferred (); // deferred.resolve ( '구속.'); deferred.fail (() => CONSOLE.LOG ( '실패 ()')); deferred.catch (() => CONSOLE.LOG ( '캐치 ()')); deferred.done (() => CONSOLE.LOG () () - 1 일 '); deferred.then (() => CONSOLE.LOG ( '2 후 ()')); deferred.done (() => CONSOLE.LOG () () 3-완료 '); deferred.then (() => {CONSOLE.LOG (4 '- 후 () - 드로'); ') 4-다음 (에서 던진'던져;}); deferred.done (() => CONSOLE.LOG () () (5) - 일 '); deferred.then (() => CONSOLE.LOG (6 '- 후 ()')); deferred.done (() => {을 console.log ( '7-수행 () - 던져'); ') (7 일에서 던진'던져;}); deferred.done (() => CONSOLE.LOG () () 8-완료 '); deferred.then (() => CONSOLE.LOG ( '9 후 ()')); CONSOLE.LOG ( '해결.'); {시도 deferred.resolve ( '솔루션.'); } 캐치 (전자) { 핸들러에서 CONSOLE.LOG (`잡힌 예외 해결의 ()`, 전자); } deferred.done (() => CONSOLE.LOG ('10 할거고 () ')); deferred.then (() => CONSOLE.LOG ('11 - 일 () ')); 을 console.log ( '스크립트의 끝.'); <스크립트 SRC = "https://code.jquery.com/jquery-3.4.1.min.js" 무결성 = "SHA384 - vk5WoKIaW / vJyUAd9n / wmopsmNhiy + L2Z + SBxGYnUkunIxVxAv / UtMOhba / xskxh" crossorigin = "익명" > script>
-
10.되는 .done는 () 추가 단계를 연결할 수있는 다른 있는지 아무것도을하지, 약속 체인을 종료합니다. 아무도 가능한 핸들이 .fail을 사용하지 수 있기 때문에 jQuery를 약속 구현, 처리되지 않은 예외를 던질 수있는이 수단 ().
되는 .done는 () 추가 단계를 연결할 수있는 다른 있는지 아무것도을하지, 약속 체인을 종료합니다. 아무도 가능한 핸들이 .fail을 사용하지 수 있기 때문에 jQuery를 약속 구현, 처리되지 않은 예외를 던질 수있는이 수단 ().
당신이 약속에 더 많은 단계를 첨부하지 않을 경우 실제적인 측면에서, 당신이되는 .done를 사용해야합니다 (). 자세한 내용은 약속 할 필요가 이유를 참조하십시오
from https://stackoverflow.com/questions/5436327/jquery-deferreds-and-promises-then-vs-done by cc-by-sa and MIT license
'JQUERY' 카테고리의 다른 글
[JQUERY] 전자 : jQuery를 정의하지 않습니다 (0) | 2020.09.30 |
---|---|
[JQUERY] 입력 텍스트 상자에 값을 가져옵니다 (0) | 2020.09.30 |
[JQUERY] 어떻게 방화범 또는 유사한 도구를 사용하여 자바 스크립트 / jQuery를 이벤트 바인딩을 디버깅하는 방법? (0) | 2020.09.30 |
[JQUERY] 어떻게 jQuery로 페이지를 새로 고침 할 수 있습니까? (0) | 2020.09.30 |
[JQUERY] 다운 상자 동적 드롭? (0) | 2020.09.30 |