Odložené jsou v dnešní době v komunitě JavaScriptu v módě a kdo může argumentovat? Deferreds, objekt představující asynchronní akci, neuvěřitelně usnadňuje práci s požadavky AJAX – žádné peklo zpětného volání, žádný problém předávání informací o požadavcích. Co když ale chcete pracovat s více odloženými? Řekněme například, že chcete spustit funkci po dokončení více požadavků AJAX. Dojo Toolkit vás pokryje s dojo/DeferredList, což je zdroj, jehož API zrcadlí jeden odložený objekt, ale dokáže zpracovat více odložených objektů.
Použití odložených
Dojo vrací odložené objekty z mnoha operací, včetně animací a požadavků XHR. U objektu Deferred můžete použít then
vlastnost reagovat na odpověď po dokončení asynchronní interakce:
// A very basic usage of dojo/request request("service.php?id=someid").then(function(response) { console.log("request result is:", response); });
Výše uvedený příklad ukazuje základní požadavek AJAX a zpracování výsledného Deferred. Snadné, že? Ale co když chcete, aby se akce provedla až po vyřešení několika Odložených?
Použití dojo/DeferredList
DeferredList je správce pro více odložených, takže manipulace s více odloženými je hračka:
// Require the Dojo dependencies require(["dojo/request", "dojo/DeferredList"], function(request, DeferredList) { console.log("Request loaded!", request); // Request 1 var promise1 = request("/endpoint/1").then(function(response) { console.log("request 1 result", response); }); // Request 2 var promise2 = request("/endpoint/2").then(function(response) { console.log("request 2 result", response); }); // Create a DeferredList to manage both of them var list = new DeferredList([promise1, promise2]); // When they're both resolved... list.then(function(result) { // result is: [Array[2], Array[2]] // result item[0] is the result of each request // Do something! }); });
Výše uvedený příklad představuje všechny růže: všechny úspěšné odložené. Co když Deferred selže; chyba 404, časový limit požadavku nebo odložené zamítnutí? To vše vyléčí malá validace:
// Require the Dojo dependencies require(["dojo/request", "dojo/DeferredList"], function(request, DeferredList) { console.log("Request loaded!", request); // Request 1 var promise1 = request("/endpoint/1").then(function(response) { console.log("request 1 result", response); }); // Request 2 var promise2 = request("/endpoint/2").then(function(response) { console.log("request 2 result", response); }); // Request 3: A request that will fail... var promise3 = request("/endpoint/noexist").then(function(response) { console.log("request 3 result (fail)", response); }); // Create a DeferredList to manage both of them var list = new DeferredList([promise1, promise2, promise3]); // When they're both resolved... list.then(function(result) { if(request[0][0] && request[1][0] && request[2][0]) { // request[2][0] is false // Success! } else { // React to a failure } }); });
Pokud se příslib pro daný Odložený vrátí false, víte, že požadavek (nebo asynchronní akce) selhal. Druhý argument vrácený Deferred poskytuje informace o požadavku a proč selhal:
{ "message": "Unable to load noexist.php status: 404", "response": { "url": "/endpoint/noexist", "options": { "headers":{} }, "xhr": { "statusText": "Not Found", "status": 404, "response": "{404 page html}"} } }
Zde uvedený příklad je příliš zjednodušený. Jedním z realistických příkladů je ten, který jsem použil k vytvoření příkladu dojoxu/mobilního TweetView, který posílá více požadavků JSONP (twitterový profil a seznam časové osy Twitteru) pro widget Twitter na straně klienta. Prostředek dojo/DeferredList usnadňuje a zpříjemňuje manipulaci s více asynchronními akcemi. Další důvody, proč používat sadu nástrojů Dojo ve vaší další webové aplikaci!