javascript - 将变量从 Backbone.js 路由器初始化函数传递到另一个路由器函数的 forEach 语句

Question

请参阅下面更新的代码...

我正在尝试过滤一个 backbone使用 forEach 语句获取另一个集合的属性的集合。我该如何编写这个以便在 forEach 语句中维护对变量“this.neighborhoodsCollection”的引用。这可能不是backbone问题和更多javascript问题。换句话说，我想如何将变量“this.neighborhoodsCollection”传递到我的 forEach 语句中。以下是我尝试采取的步骤:

我将获取 StoryCollection 和 NeighborhoodsCollection 的结果传递给路由器:

$(document).ready(function() {
        var neighborhoodsCollection = new NeighborhoodsCollection();
        neighborhoodsCollection.fetch({
            success: function(){
                var storyCollection = new StoryCollection();
                storyCollection.fetch({
                    success: function () {
                    var app = new AppRouter(neighborhoodsCollection, storyCollection);
                    Backbone.history.start();
                    }
                });
            }
        });
    });

然后我将传入的参数设置为局部变量...

initialize: function(neighborhoodsCollection, storyCollection){
    this.neighborhoodsCollection = neighborhoodsCollection;
    this.storyCollection = storyCollection;

}

在路由器内的另一个函数中，我根据 Neighborhoods 集合中的每个邻域属性检查当前 StoryCollection 中的邻域数组，如果存在匹配项，我会将 Neighborhoods 集合对象添加到我的 Leaflet map 中。

load_story:function (id) {
        //get Stories model object by id
        this.story = this.storyCollection.get(id);

var storyNeighborhoods = this.story.attributes.neighborhoods;

    storyNeighborhoods.forEach(function(neighborhood){

     var hood = this.neighborhoodsCollection.attributes;
     var nabe = [];
     var nabeGeo = [];


     for(var i = 0; i < _.size(hood); i++){
         nabe.push(this.neighborhoodsCollection.attributes[i].properties.neighborhood);

         nabeGeo.push(this.neighborhoodsCollection.attributes[i]);

         var filterNabe = $.inArray(neighborhood, nabe);

         if(filterNabe > -1){
            L.geoJson(nabeGeo).addTo(map);
         }else{
            console.log('not found')
         }
     }
 });
}

更新

@Quince 的回答让我走上了正确的道路，使用 pluck 和交集 undescore 助手。现在我有一个包含每个匹配的邻域字符串的数组。然后我尝试使用该字符串对集合执行获取。这是我的集合的数据结构:

Object { cid: "c1", attributes: Object, _changing: false, _previousAttributes: Object, changed: Object, _pending: false }

这是我的集合中单个对象的结构:

[{ "id": "Greenpoint", "type": "Feature", "properties": { "neighborhood": "Greenpoint", "boroughCode": "3", "borough": "Brooklyn" ... }]

但是我无法在此集合上成功执行 get(id)。也许这与需要从集合中的每个对象创建模型有关，或者类似的事情？

作为引用，以下是基于@Quince示例的相关代码:

  var neighborhoodsCollection = this.neighborhoodsCollection;

var neighborhoodsCollectionObjects = this.neighborhoodsCollection.attributes;

var neighborhoodsCollectionProperties = _.pluck(neighborhoodsCollectionObjects, 'properties');

var neighborhoodsCollectionArray = _.pluck(neighborhoodsCollectionProperties, 'neighborhood');

var storyCollectionNeighborhoods = this.story.attributes.neighborhoods;

var neighborhoodIntersection = _.intersection(storyCollectionNeighborhoods, neighborhoodsCollectionArray);

neighborhoodIntersection 的值是一个包含单个字符串“Greenpoint”的数组

neighborhoodIntersection.forEach(function(neighborhood){
    neighborhoodsCollection.get(neighborhood);
});

Answer 1

我希望我理解正确，您想浏览每个故事，如果它有一个与主要社区集合中的其中一个社区相匹配的社区，那么您想获取对其的引用吗？

解决这个问题的方法是在将故事的邻域集合中的 id 与主邻域集合中的 id 进行比较时使用下划线交集函数。然后使用此列表从主要社区集合中获取实际引用。以下是我的意思的示例 ( or the code pen so you can see in the console that the references are obtained )

//setup of models and collections 
var NeighbourHoodModel = Backbone.Model.extend({
  defaults:{
    name: null
  }
});

var StoryModel = Backbone.Model.extend({
  defaults:{
    neighbourhoods:null
  }
});
var NeighborhoodsCollection = Backbone.Collection.extend({
  model: NeighbourHoodModel
});
var StoryCollection = Backbone.Collection.extend({
  model: StoryModel
})

var neighbourHoods = new NeighborhoodsCollection([
  { id:1,name: "neighbourhood-1"},
  { id:2,name: "neighbourhood-2"},
  { id:3,name: "neighbourhood-3"},
  { id:4,name: "neighbourhood-4"}
]);

var stories = new StoryCollection([
  { id:1, neighbourhoods: new NeighborhoodsCollection([
      { id:1,name: "neighbourhood-1"},
      { id:2,name: "neighbourhood-2"}
     ]),
  },
  { id:2, neighbourhoods: new NeighborhoodsCollection([
      { id:1,name: "neighbourhood-1"},
      { id:2,name: "neighbourhood-2"}
     ]),
  }
]);

(function(neighbourHoods,stories){
  var _matchedNeighbourhoodIds = [];
  //grab an array (usign pluck) of all the nighboorhood ids
  //do this here so don;t have to do it on every loop
  var neighbourhoodIds = neighbourHoods.pluck("id");

  stories.forEach(function(story){

   //for each story grab an array (using pluck) of all the stories neighborhoods
   //perform an intersection of the two arrays (returning an array of id's that appear in both lists)
    //slice that array
    //for each element add it to the _matchNeighbourhoods in at a sorted index (this is so that we don't end with duplicates in the array)
    _.intersection(story.get("neighbourhoods").pluck("id"),neighbourhoodIds).slice(0).forEach(function(neighbourhoodId){
      _matchedNeighbourhoodIds[_.sortedIndex(_matchedNeighbourhoodIds,neighbourhoodId)] = neighbourhoodId;
    });
  });


  _matchedNeighbourhoodIds.forEach(function(matchedNeighbourHoodId){
         console.log(neighbourHoods.get(matchedNeighbourHoodId));
});

})(neighbourHoods,stories);

我在执行此操作后刚刚看到的一个问题是 _.sortedIndex，尽管该数组仅包含matchedNeighbourhoods 的唯一id，但在添加已匹配的邻域时，仍然需要花时间来过度调整值。