Question

我正在使用API提取通知。现在是这种情况：

1-我调用了API，获得了2条记录并将它们存储在局部变量（notifications）中以在视图中显示。

[{"id": 1, "notification": "bla"}, {"id": 2, "notification": "bla bla"}]

2-我每5秒钟调用一次相同的API，以检查是否有新通知。这次，我需要将API响应与本地变量进行比较，因此，如果记录中没有新的通知（不同的id），请不要压入本地变量，而应压入其他压入。

我尝试过这样的事情：

var val = JSON.parse(data);
if( val.length > 0 ) {
    for( var i = 0; i < val.length; i++ ) {
        this.notifications.forEach(element => {
            if( element.id != val[i].id ) {
                this.notifications.push(val[i]);
            }
        });

    }
}

但是它添加了重复的记录。任何帮助将不胜感激。

谢谢

Answer 1

您需要使用Array.find()在val数组中查找重复的对象。

var notifications = [{"id": 1, "notification": "bla"}, {"id": 2, "notification": "bla bla"}];

var data = `[{"id": 1, "notification": "bla"}, {"id": 4, "notification": "bla bla bla"}]`

var val = JSON.parse(data);
if( val.length > 0 ) {
   val.forEach((obj)=>{
     var existNotification = notifications.find(({id}) => obj.id === id);
     if(!existNotification){
       notifications.push(obj);
     }
   });
}
console.log(notifications);

当前，由于id值与id数组中所有现有的notifications值进行比较，您将获得重复的元素。因此，如果id中的一个与另一个不匹配，它将立即被推入notifications数组中。因此，更好的方法和简单的方法是在数组上使用find操作来检查现有对象。

Answer 2

一种更健壮的方法可以通过在JS中使用map来实现。

而不是为notifications（大小= n）中的每个对象迭代data（大小= m），将导致O(m x n)的时间复杂度更高。

因此，可以在O(n)中进行如下操作：-

var notifications = new Map();

// assuming you get this at the beginning
var data1 = `[{"id": 1, "notification": "bla"}, {"id": 2, "notification": "bla bla"}]`;

checkAndAddNotification(data1);

// assuming you get this at the second time
var data2 = `[{"id": 1, "notification": "bla"}, {"id": 4, "notification": "bla bla bla"}]`

checkAndAddNotification(data2);

function checkAndAddNotification(data){
  var val = JSON.parse(data);
  
  if (val){
    val.forEach((obj)=>{
     var existNotification = notifications.get(obj.id);
     
     if(!existNotification){
       notifications.set(obj.id, obj);
     }
   });
  }
}

console.log(notifications);

notifications.forEach((notification) => console.log(notification));

在运行代码时也请打开浏览器控制台。

即使您打算遍历地图，该顺序也将按照插入对象的顺序保留。 Please look here for more。

Angular 6比较两个JSON数组

2 个答案: