使用JavaScript承诺库运行多个RSVP.js承诺
下面的简单演示JavaScript代码使用RSVP.js允诺库https://github.com/tildeio/rsvp.js/来使用AJAX加载一些JSON数据，并在所有JSON数据加载之后在完成时触发一些代码。
我希望在加载了JSON数据之后，将其扩展为更多的承诺，而这些承诺不是AJAX请求。
例如，在加载了JSON数据之后，我希望创建另一个承诺，它将运行一个函数，该函数将设置一些DOM事件处理程序/侦听器。
在设置了事件处理的函数之后，我想在事件完成后运行其他函数。
我是非常新的，学习承诺仍然，在某些情况下，仍然在学习JavaScript，所以我可以得到一些帮助。下面和JSFIddle上扩展我的示例代码将非常感谢！
我相信，如果向我展示了如何在我的演示中添加1多个承诺，那么我就可以在我的最后一个应用程序中添加足够多的内容。
JSFIddle代码演示如下：http://jsfiddle.net/jasondavis/fttzoggj/
var jsonPromiseCache = {};
// AJAX function to load JSON data using Promise()
var getJsonDataPromise = function(url, key) {
if (!jsonPromiseCache[key]) {
jsonPromiseCache[key] = new RSVP.Promise(function(resolve, reject){
// If jsonPromiseCached data is not set then make AJAX requiest to get it
var client = new XMLHttpRequest();
client.open("GET", url);
client.onreadystatechange = handler;
client.responseType = "json";
client.setRequestHeader("Accept", "application/json");
client.send();
console.log('---- "client" XMLHttpRequest/AJAX variable ======= ',client);
function handler() {
if (this.readyState === this.DONE) {
// On AJAX success, resolve() our Promise() and set result to cached variable
// to avoid duplicate AJAX requests for this jsonCache[key] Data where "key"
// is used to assign to each AJAX endpoint URL/request of JSON data...
// (milestones, tasks, users, etc...)
if (this.status === 200) {
jsonPromiseCache[key] = this.response;
console.log('---- jsonPromiseCache['+key+'] ====== ',jsonPromiseCache[key]);
// Resolve() the Promise() on AJAX success
resolve(this.response);
// On AJAX failure, reject() our Promise()
}else{
reject(this);
}
}
};
// If JSON data for this key is already jsonPromiseCached, then return the jsonPromiseCached version
// instead of making a new AJAX request!
});
}
return jsonPromiseCache[key];
};// EXAMPLE USAGE DEMO
// usage loading JSON data with AJAX using Promises
var promises = {
users: getJsonDataPromise('/echo/json/', 'users'),
task: getJsonDataPromise('/echo/json/', 'task')
};
RSVP.hash(promises)
.then(function(results) {
console.log('then() function ran on success of loading JSON data');
console.log(results);
console.log('results.users', results.users); // print the users JSON results
console.log('results.task', results.task); // print the task JSON results
// I want to create another Promise here which will run a function that creates a bunch of DOM Event handlers/listeners and in that function when it is done loading it should fire a success like the above does when JSON data is done loading
})
.finally(function(){
console.log('finally() function ran on success and failure.... It is always ran!');
})
.catch(function(reason){
console.log('[ERROR] REASON:',reason.statusText); //if any of the promises fails.
});
更新
我在这里更新了我的JSFiddle演示程序，http://jsfiddle.net/jasondavis/fttzoggj/2添加了一个新函数initDomEvents()，并将它添加到了一个initDomEvents调用中。我的控制台显示一切都按我的意愿运行，但是由于某种原因，现在我的错误被触发了。
回答 2
Stack Overflow用户
发布于 2015-10-28 00:00:33
我的控制台显示一切都按我的意愿运行，但是由于某种原因，现在我的错误被触发了。
在您的resolve函数中没有reject和initDomEvents函数。它们仅作为new RSVP.Promise(…)回调的参数提供。试图调用它们会引发一个错误，该错误将被捕获并传播到您的错误处理程序(但它没有.statusText属性，因此只打印了undefined )。
正如我在注释中所说的，如果您的函数不做任何异步操作，就不需要返回承诺。您只需要从承诺回调中return一个值或throw一个异常。
如果坚持围绕结果或拒绝创建承诺，则可以使用RSVP.Promise.resolve(…)或RSVP.Promise.reject(…)函数创建已实现/拒绝的承诺对象。
Stack Overflow用户
发布于 2015-10-27 18:48:21
你使用RSVP的具体原因是什么？我会转到jQuery承诺。
var d = $.Deferred;
$.ajax({
url: url,
cache: true,
dataType: 'json',
success: function(data){
d.resolve(data);
},
error: function(error){
d.reject();
}
});
$.when(d).then(function(data){
//handle
});https://stackoverflow.com/questions/33375874
复制相似问题
腾讯云开发者
