数组合并、去重复的几种方式

226 阅读2分钟
  1. unshift(改变原数组,添加到数组头部,不去重复)
let arr1 = [1, 2];
arr1.unshift(3, 4, 5);
console.log(arr1); // [3, 4, 5, 1, 2]
  1. push(改变原数组,添加到数组尾部,不去重复)
let arr1 = [1, 2];
arr1.push(3, 4, 5);
console.log(arr1); // [1, 2, 3, 4, 5]
  1. concat(返回新数组,不改变原数组,不去重复)
let arr1 = [1, 2, 3];
let arr2 = [1, 2, 3, 4, 5];
let arr3 = arr1.concat(arr2);
console.log(arr1); // [1, 2, 3]
console.log(arr2); // [1, 2, 3, 4, 5]
console.log(arr3); // [1, 2, 3, 1, 2, 3, 4, 5]
  1. ES6扩展运算符(返回新数组,不改变原数组,不去重复)
let arr1 = [1, 2, 3];
let arr2 = [1, 2, 3, 4, 5];
let arr3 = [...arr1, ...arr2];
console.log(arr1); // [1, 2, 3]
console.log(arr2); // [1, 2, 3, 4, 5]
console.log(arr3); // [1, 2, 3, 1, 2, 3, 4, 5]
  1. ES6 Set去重复(返回新数组,不改变原数组,去重复)
let arr1 = [1, 2, 2, 3, 3];
let arr2 = [...new Set(arr1)];
console.log(arr1); // [1, 2, 2, 3, 3]
console.log(arr2); // [1, 2, 3]

6.数组元素为对象,根据某一属性合并去重复

getArray(obj0, obj1, itemName) {
  let obj = obj0.concat(obj1); //两个数组对象合并
  let objList = []; //去重后数据的新数组
  for (let item0 of obj) {
    //循环json数组对象的内容
    let flag = true; //建立标记,判断数据是否重复,true为不重复
    for (let item1 of objList) {
      //循环新数组的内容
      if (item0[itemName] == item1[itemName]) {
        //让json数组对象的内容与新数组的内容作比较,相同的话,改变标记为false
        flag = false;
      }
    }
    if (flag) {
      //判断是否重复
      objList.push(item0); //不重复的放入新数组。  新数组的内容会继续进行上边的循环。
    }
  }
  return objList;
},

let arr1 = [
    {
      id: "001",
      name: "小红",
    },
    {
      id: "002",
      name: "小绿",
    },
    {
      id: "003",
      name: "小蓝",
    }
  ];
  let arr2 = [
    {
      id: "001",
      name: "小红",
    },
    {
      id: "004",
      name: "小紫",
    },
    {
      id: "005",
      name: "小绿",
    }
  ];
  let arr3 = this.getArray(arr1, arr2, "id");
  console.log(arr3); 
  // [
  //   {
  //     id: "001",
  //     name: "小红",
  //   },
  //   {
  //     id: "002",
  //     name: "小绿",
  //   },
  //   {
  //     id: "003",
  //     name: "小蓝",
  //   },
  //   {
  //     id: "004",
  //     name: "小紫",
  //   },
  //   {
  //     id: "005",
  //     name: "小绿",
  //   },
  // ]