2016-07-14 8 views
0

Ich arbeite an einem Projekt, das jQuery nicht verwendet. Alle unterstützten Browser verfügen über native Promises.Wie mache ich ein verzögertes Muster mit nativen JavaScript-Versprechen?

Ich möchte das latente Muster replizieren, die jquery über $ bereitgestellt .Deferred

//Example 
var deferred1 = new $.Deferred(); 
var deferred2 = new $.Deferred(); 

$.get(someUrl, function(){ 
    ... 
    deferred1.resolve() 
}) 

$.get(someUrl, function(){ 
    ... 
    deferred2.resolve() 
}) 

$.when(deferred1, deferred2).then(function(){//do stuff}) 

Wie kann ich das mit nativen Versprechen?

+0

diese deffereds Versprechungen sind. benutze sie auf die gleiche Weise. aber scheint, müssen Sie Ihre eigenen erstellen, die Versprechen verwenden wird - http://www.html5rocks.com/en/tutorials/es6/promises/#toc-promisifying-xmlhttprequest – llamerr

Antwort

2

Bitte versuchen Sie dies:

function get(url) { 
    //Make and return new promise, it takes a callback: 
    //A function that will be passed other functions via the arguments resolve and reject 
    return new Promise((resolve, reject) => { 
     var request = new XMLHttpRequest(); 
     request.addEventListener("load",() => { 
      //Success ! we need to resolve the promise by calling resolve. 
      resolve(request.responseText); 
     }); 
     request.addEventListener("error",() => { 
      //Error! we need to reject the promise by calling reject . 
      reject(request.statusCode); 
     }); 
     //Perform the request 
     request.open('GET', url); 
     request.send(); 
    }); 
}; 

var urls = [ 
     'https://httpbin.org/ip', 
     'https://httpbin.org/user-agent' 
]; 
//Create an array of promises 
// is equivalent to 
//var promises = []; for(var i in urls) promises.push(get(url[i])); 
var promises = urls.map(get); 

//The Promise.all(iterable) method returns a promise that resolves when 
//all of the promises in the iterable argument have resolved, 
//or rejects with the reason of the first passed promise that rejects. 
Promise.all(promises).then(function (responses) { 
    console.log(responses); 
}); 

Demo:https://jsfiddle.net/iRbouh/52xxjhwu/

+0

Einige Erklärung wäre nett. Ansonsten, gute Antwort! – Pavlo

+1

Ich habe den Code kommentiert, bitte schau es Dir an;) –