JavaScript 数组去重(基本类型数组 | 对象数组)

101 阅读1分钟

1. Set

利用每个值在 Set 中只会出现一次来实现去重。只能对基本类型数组进行去重,不可用于对象数组。

基本类型数组去重:

let array = [1, 1, 2, 2, 3, 4, 4];
let res = [...new Set(array)]; 
console.log(res); // 输出: [1, 2, 3, 4]

2. filter

利用 Array.filter() 方法实现数组去重,去重逻辑由 filter 的回调函数实现。

基本类型数组去重:

let array = [1, 1, 2, 2, 3, 4, 4];
let res = array.filter((value, index, self) => {
    return self.indexOf(value) === index;
});
console.log(res); // 输出: [1, 2, 3, 4]

对象数组去重:

let array = [  
  { id: 1, name: '张三' },  
  { id: 1, name: '张三' }, 
  { id: 2, name: '李四' },  
  { id: 3, name: '王五' },
];  
  
let idSet = new Set();
let res = array.filter(item => {  
  if (!idSet.has(item.id)) {  
    idSet.add(item.id);  
    return true;  
  }  
  return false;
});  
  
console.log(res); 
// 输出: [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 3, name: 'Charlie' } ]

3. reduce

利用 Array.reduce() 方法。reduce 函数提供一个空数组作为累加器的初始值。遍历数组中的每个元素并检查它是否已经存在累加器数组中。如果不在,就添加到累加器数组中。

基本类型数组去重:

let array = [1, 1, 2, 2, 3, 4, 4];
let res = array.reduce((accumulator, current) => {
    !accumulator.includes(current) && accumulator.push(current);
    return accumulator;
}, []);
console.log(res); // 输出: [1, 2, 3, 4]

对象数组去重:

// 获取不重名的人员列表
let array = [
    { id: 1, name: '张三' },
    { id: 2, name: '张三' },
    { id: 3, name: '李四' },
    { id: 4, name: '王五' },
];

let res = array.reduce((accumulator, current) => {
    !accumulator.includes(current.name) && accumulator.push(current.name);
    return accumulator;
}, []);
console.log(res); // 输出: ["张三", "李四", "王五"]