jQuery
jQuery遅延オブジェクトと約束
サーチ…
前書き
jQueryの約束は、ビルディングブロック方式で非同期操作を連鎖させる巧妙な方法です。これにより、コールバックの古いスクールネストが置き換えられます。
基本的な約束の作成
ここでは、「与えられた時間が経過したときに進むことを約束する」関数の非常に単純な例を示します。これは、新しいDeferred
オブジェクトを作成することで行います。これは後で解決され、Deferredの約束を返します:
function waitPromise(milliseconds){
// Create a new Deferred object using the jQuery static method
var def = $.Deferred();
// Do some asynchronous work - in this case a simple timer
setTimeout(function(){
// Work completed... resolve the deferred, so it's promise will proceed
def.resolve();
}, milliseconds);
// Immediately return a "promise to proceed when the wait time ends"
return def.promise();
}
そして、このように使う:
waitPromise(2000).then(function(){
console.log("I have waited long enough");
});
非同期の約束の連鎖
複数の非同期タスクを順番に実行する必要がある場合は、そのプロミスオブジェクトを連鎖させる必要があります。ここに簡単な例があります:
function First() {
console.log("Calling Function First");
return $.get("/ajax/GetFunction/First");
}
function Second() {
console.log("Calling Function Second");
return $.get("/ajax/GetFunction/Second");
}
function Third() {
console.log("Calling Function Third");
return $.get("/ajax/GetFunction/Third");
}
function log(results){
console.log("Result from previous AJAX call: " + results.data);
}
First().done(log)
.then(Second).done(log)
.then(Third).done(log);
jQuery ajax()の成功、エラーVS .done()、.fail()
成功とエラー: Ajaxリクエストの正常終了時に呼び出される成功コールバック。
要求の作成中にエラーが発生した場合に呼び出される障害コールバック。
例:
$.ajax({
url: 'URL',
type: 'POST',
data: yourData,
datatype: 'json',
success: function (data) { successFunction(data); },
error: function (jqXHR, textStatus, errorThrown) { errorFunction(); }
});
.done()と.fail():
.ajax()。done(function(data、textStatus、jqXHR){}); jQuery 1.8で廃止されたメソッド.success()を置き換えます。これは上記のsuccessコールバック関数の代替構成です。
.ajax()。fail(function(jqXHR、textStatus、errorThrown){}); jQuery 1.8で廃止されたメソッド.error()を置き換えます。これは上記の完全なコールバック関数の代わりの構造です。
例:
$.ajax({
url: 'URL',
type: 'POST',
data: yourData,
datatype: 'json'
})
.done(function (data) { successFunction(data); })
.fail(function (jqXHR, textStatus, errorThrown) { serrorFunction(); });
約束の現在の状態を取得する
デフォルトでは、プロミスの状態は作成時に保留中です。約束を作成した繰延オブジェクトがそれを解決/拒否すると、約束の状態が変更されます。
var deferred = new $.Deferred();
var d1= deferred.promise({
prop: "value"
});
var d2= $("div").promise();
var d3= $("div").hide(1000).promise();
console.log(d1.state()); // "pending"
console.log(d2.state()); // "resolved"
console.log(d3.state()); // "pending"
Modified text is an extract of the original Stack Overflow Documentation
ライセンスを受けた CC BY-SA 3.0
所属していない Stack Overflow