RxJS Google 地图标记

Question

我正在尝试使用 RxJS observables 和 jQuery $.ajax

从数据库中仅检索新的 "Google Map" Markers

我每 5 秒收到一组标记。当数组中的数据发生变化时，即添加了新的标记，我只需要过滤掉新的标记。

var oldArray = [["ObjA",3455,643523,2],["ObjB",5346,2134,1],["ObjC",5341,7135,0]];
var newArray = [["ObjA",3455,643523,2],["ObjD",2384,4791,3],["ObjB",5346,2134,1],["ObjC",5341,7135,0],["ObjF",2631,7228,4]];

所以从newArray这里我需要过滤掉["ObjD",2384,4791,3]和["ObjF",2631,7228,4]

我完全不知道它是如何完成的，是否可以仅使用 RxJS 来完成。

如果有人能引导我朝着正确的方向前进，我将不胜感激！

var observable = Rx.Observable
  .interval(5000)
  .flatMap(function() {
    return Rx.Observable
      .from($.ajax({url: "https://somedomain.com/json"}).promise())
  })
  .filter(x => !!x === true)
  .distinctUntilChanged();


observable.subscribe((response) => {
      var newMarker = $.parseJSON(response.data);                    
});

Answer 1

对于数组，你不需要 RxJS，你可以使用 ES6 中新的数组运算符：

onlyNewArray = 
    newArray
        .filter(newItem => 
            !oldArray.some(oldItem => oldItem[0] === newItem[0]));

some() 将逐一检查数组中的项目，如果有满足条件的项目，它将 return 为真。在这里，我们检查 newArray 中的每个项目是否存在于旧版本中，如果存在，则不将它们包含在 onlyNewArray

中

更新

这将检查 oldItem 中的所有项目是否等于 newItem 中的相应项目：

onlyNewArray = 
    newArray
        .filter(newItem => 
            !oldArray.some(oldItem => 
                oldItem.every((prop, index) =>
                    prop === newItem[index])));

更新 2

只检查数组的连续部分，可以先切片：

onlyNewArray = 
    newArray
        .filter(newItem => 
            !oldArray.some(oldItem => 
                oldItem
                    .slice(0,3)
                    .every((prop, index) =>
                        prop === newItem[index])));

或者，您可以提供要跳过的索引，然后使用简单的 if/else 子句：

let dontCheck = 1;

onlyNewArray = 
    newArray
        .filter(newItem => 
            !oldArray.some(oldItem => 
                oldItem.every((prop, index) => {
                    if(index == dontCheck){
                        return true;
                    } else {
                        prop === newItem[index]
                    }
                })));

RxJS Google 地图标记

RxJS Google Maps Markers

rxjs

reactivex