이후 jQuery를 1.8 .then 로 동일하게 동작합니다 .pipe:
지원 중단 알림 : jQuery 1.8부터이 deferred.pipe()메서드는 더 이상 사용되지 않습니다. deferred.then()를 대체하는 방법은 대신 사용해야합니다.
과
jQuery를 1.8으로 의 deferred.then()방법은 지금은 사용되지 않는 대신, 상태 및 기능을 통해 지연된의 값을 필터링 할 수있는 새로운 약속을 반환하는 deferred.pipe()방법을.
아래의 예는 여전히 도움이 될 수 있습니다.
그들은 다른 목적으로 사용됩니다.
.then()프로세스의 결과로 작업하고 싶을 때, 즉 문서에서 말하는 것처럼 지연된 객체가 해결되거나 거부 될 때 사용됩니다. 그것은 사용하는 것과 동일 .done()하거나 .fail().
어떻게 든 결과 .pipe()를 (사전) 필터링 하는 데 사용 합니다 . 콜백의 반환 값은 및 콜백에 .pipe()인수로 전달됩니다 . 또한 다른 지연된 객체를 반환 할 수 있으며 다음 콜백이이 지연된 항목에 등록됩니다.donefail
.then()(또는 .done(), .fail()) 의 경우 가 아니라 등록 된 콜백의 반환 값이 무시됩니다.
그래서 사용하는 것이 아닌 하나 .then() 또는 .pipe() . 당신은 할 수 사용 .pipe()과 같은 목적으로 .then()하지만, 그 반대는 유지되지 않습니다.
예 1
일부 작업의 결과는 객체의 배열입니다.
[{value: 2}, {value: 4}, {value: 6}]
값의 최소값과 최대 값을 계산하려고합니다. 두 개의 done콜백 을 사용한다고 가정 해 보겠습니다 .
deferred.then(function(result) {
// result = [{value: 2}, {value: 4}, {value: 6}]
var values = [];
for(var i = 0, len = result.length; i < len; i++) {
values.push(result[i].value);
}
var min = Math.min.apply(Math, values);
/* do something with "min" */
}).then(function(result) {
// result = [{value: 2}, {value: 4}, {value: 6}]
var values = [];
for(var i = 0, len = result.length; i < len; i++) {
values.push(result[i].value);
}
var max = Math.max.apply(Math, values);
/* do something with "max" */
});
두 경우 모두 목록을 반복하고 각 개체에서 값을 추출해야합니다.
두 콜백에서 개별적으로이 작업을 수행 할 필요가 없도록 미리 값을 추출하는 것이 더 낫지 않을까요? 예! 그리고 그것이 우리가 사용할 수있는 것 .pipe()입니다 :
deferred.pipe(function(result) {
// result = [{value: 2}, {value: 4}, {value: 6}]
var values = [];
for(var i = 0, len = result.length; i < len; i++) {
values.push(result[i].value);
}
return values; // [2, 4, 6]
}).then(function(result) {
// result = [2, 4, 6]
var min = Math.min.apply(Math, result);
/* do something with "min" */
}).then(function(result) {
// result = [2, 4, 6]
var max = Math.max.apply(Math, result);
/* do something with "max" */
});
분명히 이것은 구성된 예이며이 문제를 해결하기위한 여러 가지 (아마도 더 나은) 방법이 있지만 요점을 설명하기를 바랍니다.
예 2
Ajax 호출을 고려하십시오. 때로는 이전 호출이 완료된 후 하나의 Ajax 호출을 시작하려고합니다. 한 가지 방법은 done콜백 내에서 두 번째 호출을 만드는 것입니다 .
$.ajax(...).done(function() {
// executed after first Ajax
$.ajax(...).done(function() {
// executed after second call
});
});
이제 코드를 분리하고 다음 두 Ajax 호출을 함수 안에 넣길 원한다고 가정합니다.
function makeCalls() {
// here we return the return value of `$.ajax().done()`, which
// is the same deferred object as returned by `$.ajax()` alone
return $.ajax(...).done(function() {
// executed after first call
$.ajax(...).done(function() {
// executed after second call
});
});
}
두 번째 Ajax 호출에 makeCalls대한 콜백을 첨부하기 위해 호출 하는 다른 코드를 허용하기 위해 지연된 객체를 사용하고 싶지만
makeCalls().done(function() {
// this is executed after the first Ajax call
});
두 번째 호출이 done콜백 내부에서 이루어 지고 외부에서 액세스 할 수 없기 때문에 원하는 효과를 얻지 못할 것 입니다.
해결책은 .pipe()대신 사용하는 것입니다.
function makeCalls() {
// here we return the return value of `$.ajax().pipe()`, which is
// a new deferred/promise object and connected to the one returned
// by the callback passed to `pipe`
return $.ajax(...).pipe(function() {
// executed after first call
return $.ajax(...).done(function() {
// executed after second call
});
});
}
makeCalls().done(function() {
// this is executed after the second Ajax call
});
를 사용 .pipe()하면 호출의 실제 흐름 / 순서를 노출하지 않고도 "내부"Ajax 호출에 콜백을 추가 할 수 있습니다.
일반적으로 지연된 객체는 코드를 분리하는 흥미로운 방법을 제공합니다. :)