javascript - 如何有选择地从 Backbone 集合和服务器中删除模型？

Question

例如，如果您想从待办事项列表中删除已完成的待办事项。

有选择地从 Backbone 集合和服务器中删除模型似乎是一项常见任务。常见的方法有哪些？每种方法的成本和 yield 是什么？

Answer 1

解决方案一

var toRemove = collection.filter(function(model) {
  return condition(model);
});
_.invoke(toRemove, 'destroy');

这似乎是最干净的方式。这就是阿迪used在他的书中删除已完成的待办事项(这是我首先列出此解决方案的一个重要原因)。如果您重复使用过滤器功能(就像他一样)，它会特别干净。

但是，我认为它比解决方案二慢，因为它涉及 collection 上的迭代。和toRemove ，而解决方案二仅涉及 collection 上的迭代。不过，它们都有线性运行时间，所以这没什么大不了的。

<小时/>

解决方案二

for (var i = collection.models.length-1; i >= 0; i--) { // looping from back to front
  var model = collection.models[i];
  if (condition(model)) model.destroy();
}

我觉得这个还是比较干净的。如上所述，这样做的好处是只需循环遍历集合，而不是集合 + 集合的过滤版本。

从后到前循环很重要。考虑一下从前往后循环时会发生什么:

for (var i = 0; i < collection.models.length; i++) { // looping from front to back
  var model = this.models[i];
  if (condition(model)) {
    model.destroy();
    i--;
  }
}

当您销毁模型时， collection.models 中的模型基本上都是向上移动一位。这有两个含义:

1. 数组长度减一。

2. 假设您删除了元素二。下一个元素将是四个，而不是三个。索引增加到 3，并且由于模型上移了 1，因此 3 的索引为 2，4 的索引为 3。

解决方案:

1. 计算collection.models.length在循环的每次迭代之后。 IE。 for (var i = 0; i < **collection.models.length**; i++)

2. 递减 i销毁模型后。

您可以从前往后循环，但您只需要解决这些问题，这会使事情变得更加复杂。

<小时/>

解决方案三

var toRemove = [];
collection.forEach(function(model) {
  if (condition(model)) toRemove.push(model);
});
toRemove.forEach(function(model) {
  model.destroy();
});

这与解决方案一非常相似。

差异:

1. 我们正在使用forEach构建toRemove而不是filter .

2. 我们正在手动迭代并调用 destroy而不是使用invoke .

与解决方案一一样，您必须迭代 collection并通过toRemove ，因此可能比解决方案二需要更长的时间。

注意:我们不能在第一个forEach中破坏模型环形。如果我们这样做，那么它就会遇到与解决方案二中的前后循环相同的问题。为了解决这个限制，我们必须使用 toRemove数组。

<小时/>

解决方案四

这使用reset() + reset事件。

var toKeep = collection.filter(function(model) {
  return condition(model);
});
collection.reset(toKeep);

和

collection.on('reset', function(after, before) {
  // let after.length = k
  // let before.length = n
  after.sort(); // k*logk
  for (var i = before.length-1; i >= 0; i--) { // n
    var model = before[i];
    if (!binarySearch(model, after)) model.remove(); // logk
  }
  // total runtime: n*logk + k*logk
});

这对我来说似乎有点过分，但这是一个选择。