如何使用 Backbone.js 将过滤后的集合转换为 JSON？

Question

所以我在 Backbone 中有一个事件列表的集合。该集合有一个方法，可以根据传递给它的类别列表来过滤列表。

var Events = Backbone.Collection.extend({
    model: Event,
    url: settings.events_url,
    filtered: function(checked) {
        return this.filter(function(e) {
            if ($.inArray(e.get('category').name, checked) >= 0) {
                return true;
            } else {
                return false;
            }
        });
    }
});

我需要做的就是将此过滤后的集合转换为 JSON，就像处理整个集合一样。

var events = new Events();
events.toJSON();

但是，由于过滤后的集合不再是实际的集合，而是模型列表，因此我没有可用的 .toJSON() 方法。有没有办法将我的过滤集合转换为真实集合？或者有没有更简单的方法将其转换为 JSON？

谢谢！

Answer 1

集合的构造函数可以将模型列表作为参数，因此：

var events = new Events();
var filteredEvents = new Events(events.filtered(true));
console.log(filteredEvents.toJSON());

Answer 2

为什么不使用标准 API？

var checked = ['foo', 'bar', 'baz'],
    filtered = eventsCollection
        .chain()
        .filter(function(model) {
            return _.include(checked, model.get('category').name);
        })
        .invoke('toJSON')
        .value();

另外，Events.filterByCategoryName 方法名称更加明确。然而，我倾向于不在设计中实现太多“方便”的方法，而是直接使用它们来拥抱标准 API。

Answer 3

您还可以尝试以下操作：

    filtered: function(checked) {
        return _.map(this.filter(function(e) {
            return $.inArray(e.get('category').name, checked) >= 0
        }), function(model) {
            return model.toJSON();
        });
    }

从内到外开始：

1. 对 this.filter 的调用将返回您已经拥有的过滤结果列表。
2. _.map 将对它传递的数组的每个条目执行一个操作（它只是返回 model.toJSON() 的结果）。

Answer 4

你可以这样做：

var myFilteredCollection = new Events(); 

_.each(myFilteredData, function(eventModel){
    myFilteredCollection.add(eventModel); 
});

myFilteredCollection.toJSON(); 

Answer 5

我解决这个问题的方法是在集合上运行一个reduce函数。这样做的优点是，您只需对集合本身执行 1 次传递，仅记住有效的模型，并在通过验证时返回模型的 JSON。

其他用于构建新集合的解决方案在性能方面非常糟糕。

    getValidItems: function () {
        //return only valid items as json
        return this.collection.reduce(function (validItems, row) {
            if (row.isValid()) {
                validItems.push(row.toJSON());
            }
            return validItems;
        }, []);
    },


    //somewhere where you save
    save: function() {
        var validItems = this.getValidItems();
        //do something with valid items
    }