Question

我有两个对象数组（我根据一些用户输入从服务器接收）：

array1 = [{id:1, name:Bob}, {id:2, name:John}, {id:3, name:Mary}];
array2 = [{id:2, field:true},{id:2, field:true}, {id:3, field:false}];

两个数组中的id彼此对应（它们是用户ID）。在现实生活中，这些阵列将更大（阵列1中最多8000个元素，阵列2中最多16000个）。

我需要完成的事情是在前端我正在显示只显示给用户ID和字段的array2信息。问题是前端用户不知道他们的用户ID，而是通过他们的名字知道他们。我需要一个包含如下对象的数组：{id:'',name:'',field:''}。

我的第一个想法是创建一个新阵列，并且＃34;将两个阵列结合起来＆＃34; ：

var new_array = [];

for (var i = 0; i < array2.length; i++) {
  var name = 'Unknown';
  for (var j = 0; j < array1.length; j++) {

    if (array1[j].id === array2[i].id) {
      name = array1[j].name;
    }

    this.new_array.push({
      id: array2[i].id,
      name: name,
      field: array1[j].field
    });
  }
}

所以我遍历第二个数组并检查id是否与第一个数组的id匹配。如果是的话，我从第一个数组中获取名称，这是用户的名称，这就是我获取用户名称的方式。

这样可行，但前端有点慢，需要几秒钟才能完成此操作，如果有很多项目，用户体验并不好，则需要等待很多。我正在寻找一种更有效的方式去做我需要做的事情。

Answer 1

运行一个数组并创建一个对象，将id值映射到条目：

var array2idx = array2.reduce(function(map, value) {
  map[value.id] = value;
  return map;
}, {});

现在，您可以通过简单查找找到array2值：

var new_array = [];
for (var i = 0; i < array1.length; i++) {
  var v2 = array2idx[array1[i].id];
  if (v2) {
    new_array.push({
      id: v2.id,
      name: array1[i].name,
      field: array1[i].field
    });
  }
}

那应该快得多。在索引对象中查找id几乎不需要任何时间。

Javascript - 更有效的方式来＆＃34; map＆＃34;两个阵列在一起

1 个答案: