24

我对 Backbone.js 有点陌生,但它可以为我做的一切都给我留下了深刻的印象,现在我正在努力学习模式和最佳实践。

我有两个收藏:

var CollA = Backbone.Collection.extend({
    model: ModelA,
    url: '/urlA'
});

var CollB = Backbone.Collection.extend({
    model: ModelB,
    url: '/urlB'
});

var collA = new CollA;
var collB = new CollB;

加载我的应用程序时,我需要从服务器获取这两个集合,并在确保两个获取都已完成时运行一些引导代码。

这是我现在的做法:

collA.fetch({success: function() {
    collB.fetch({success: function() {
        // run the needed code here.
    }});
}});

这是可行的,只有在两次获取成功完成后,才能保证所需的代码运行。但这显然效率低下,因为提取是连续运行的,一个接一个。

什么是更好的模式来执行此操作,并行运行提取,然后在两个提取成功完成后运行一些代码?

4

3 回答 3

52

如果您使用的是 jQuery,请使用when

$.when(collA.fetch(),collB.fetch()).done(function(){
    //success code here.
});

背景:

你传入一个或多个 deferred to $.when。碰巧集合返回的“jqXHR”实现了可以使用$.when. 请求基本上是并发的(好吧,只要 javascript 允许),传递给的函数.done只有在两个提取都成功时才会执行。

于 2012-08-28T22:48:37.023 回答
28

正如@JayC 所说,您可以$.when从 jQuery 中使用,我更喜欢的另一个选项是after函数(来自下划线),它在预期调用完成后执行一次。

http://underscorejs.org/#after

function runMyApp(){
  // run the needed code here.
  console.log('This will run one time but until both fetch are being completed.');
}

//2 because you have two collections
var renderApp = _.after(2, runMyApp);
collA.fetch({success: renderApp});
collB.fetch({success: renderApp});
于 2012-08-29T13:34:26.600 回答
2

如果您必须单独获取每个集合,我喜欢@JayC 的回答。您可能会争辩说,与多次提取相比,一次提取到服务器会更好。如果您在应用程序负载时获取此数据,我将对服务器进行一次调用,然后将数据传递给您的相关集合。这实际上取决于您必须在应用程序负载时获取多少集合,但老实说,我更喜欢调用服务器然后将数据传递给我的相关集合。

$.ajax({
    url: "path/to/app-load-data"
}).done(function(data) { 
    collA = new CollA(data.collA);
    collB = new CollB(data.collB);
});

这显然取决于您是否可以操纵您的 api 并且上述内容不遵循 REST。但是话又说回来,您对服务器进行了一次调用,而不是多次调用。

于 2012-08-29T07:15:27.467 回答