Angular 10 从对象数组中获取唯一值 - Javascript

当我们需要从一个对象数组中获取唯一值时，我们可以使用 Javascript 中的 Set 对象来实现。在 Angular 10 中，我们也可以使用同样的方法去获取唯一值。

const arr = [
  { id: 1, name: 'A' },
  { id: 2, name: 'B' },
  { id: 3, name: 'C' },
  { id: 1, name: 'A' }
];

const uniqueArr = Array.from(new Set(arr.map(item => item.id))).map(id => {
  return arr.find(item => item.id === id);
});

console.log(uniqueArr);  // [{ id: 1, name: 'A' }, { id: 2, name: 'B' }, { id: 3, name: 'C' }]

上述代码首先使用 map 方法将对象数组中的所有对象的 id 属性提取出来，然后使用 Set 对象去除重复的 id，最后使用 map 和 find 方法再次遍历原数组，根据 id 查找对象并构成新的数组。

注意，当我们将对象作为 Set 对象的成员去重时，实际上是以对象内存地址为基准进行去重的，因此在上述代码中，虽然第 4 个对象与第 1 个对象的属性值相同，但仍然会被保留在最终的结果中。

谢谢！