利用 ES8 标准实现数组去重-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，数组的去重是很常见的操作。在 ES6 中，我们可以使用 Set 去重，但是在 ES8 中，提供了更方便的操作方法。本文将介绍利用 ES8 标准实现数组去重的方法，并提供示例代码。

ES8 数组去重方法

ES8 引入了 Object.values 和 Object.entries 两个新的方法，其中 Object.values 可以返回由对象所有属性值组成的数组，而 Object.entries 则可以返回由对象属性键值对组成的数组。我们可以利用这两个方法实现数组去重。

具体实现方法如下：

// javascriptcn.com 代码示例
const unique = array => {
  const map = new Map();
  return array.filter(item => {
    const serializedItem = JSON.stringify(item);
    console.log(serializedItem);
    return !map.has(serializedItem) && map.set(serializedItem, item);
  });
};

const arr = [1, 1, '1', '1', 2, 2, '2', '2', [1, 2], [1, 2], { name: '张三' }, { name: '张三' }];
console.log(unique(arr)); // [1, "1", 2, "2", Array[2], Object, Object]

上述方法基于 JSON.stringify，将数组中每个项序列化成一个字符串。之后使用 Map 数据结构将该字符串作为 key，将该项作为 value 存入 map 中，如果 map 中已经有了这个 key，说明这个项已经存在于数组中，直接过滤掉。最后将 map 中的 value 集合返回即可。

另外，由于序列化后的值可能会有变化，例如对象的属性顺序会影响序列化结果，所以该方法仅适用于数组中的每个项都是基本类型或者每个项都是一定结构的对象的情况。

拓展方法：Set 去重

为了让读者更全面地了解数组去重方法，我们也提供使用 Set 去重的示例。

const arr = [1, 1, '1', '1', 2, 2, '2', '2'];
const unique = Array.from(new Set(arr));
console.log(unique); // [1, "1", 2, "2"]

上述方法使用 Set 数据结构对数组进行去重，然后使用 Array.from 方法将 Set 转换为数组，使得唯一性的数组可以通过一个操作得到。

总结

本文介绍了利用 ES8 标准实现数组去重的方法并提供参考代码，以及使用 Set 去重的方法。其中 ES8 实现去重的方法基于序列化，对数组中每个项都是基本类型或者每个项都是一定结构的对象的情况适用。这些去重方法可以提升数组的操作效率，优化前端开发。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/6534fedb7d4982a6ebacd378