如何同步多个 Backbone.js 获取？答案

【问题标题】：How to synchronize multiple Backbone.js fetches?如何同步多个 Backbone.js 获取？
【发布时间】：2012-08-23 12:16:42
【问题描述】：

我对 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.
    }});
}});

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

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

【问题讨论】：

标签： concurrency backbone.js

【解决方案1】：

如果您使用 jQuery，请使用 when:

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

背景：

您将一个或多个延迟传递给$.when。碰巧集合返回的“jqXHR”实现了可以使用$.when 组合成新的promise 的promise/Deferred 接口。这些请求基本上是并发的（好吧，只要 javascript 允许），传递给.done 的函数只有在两个提取都成功时才会执行。

【讨论】：

谢谢。都是很好的答案，这个比下划线版本在我看来更美观。是的，在这种情况下，Backbone 本身也建议重构整个负载策略。但有时多个并行提取和同步是合适的，而且效果很好。

【解决方案2】：

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

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});

【讨论】：

从来不知道这个方便的小功能......！ +1。
看起来文档链接已损坏。您现在可以参考underscorejs.org/#after。
已更新。谢谢@TactMayers！

【解决方案3】：

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

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

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

【讨论】：