前言： 数组对象去重与数组去重的不同点在于，数组对象需要指定一个属性(key值)再进行去重。

1.数组对象的自定义去重

条件为单个数组对象，遇到重复的id，可自定义覆盖原先的数组对象（比如下面代码案例模拟中的指定pic覆盖），遇到不重复的，添加入数组。输出格式如下：

案例模拟

const list = [{
  id: 1,
  pic: 'a',
  adress: 'a1'
}, {
  id: 2,
  pic: 'b',
  adress: 'b1'
}, {
  id: 3,
  pic: 'c',
  adress: 'c1'
}]
const newArr = {
  id: 3,
  pic: 'a',
  address: 'c2'
}
const newArr2 = {
  id: 4,
  pic: 'd',
  adress: 'd1'
}
/*
 * 要求：输出格式如下
 [{
  id: 1,
  pic: 'a',
  adress: 'a1'
}, {
  id: 2,
  pic: 'b',
  adress: 'b1'
}, {
  id: 3,
  pic: 'a', // 指定pic覆盖，
  adress: 'c1'
}，{
  id: 4,
  pic: 'd',
  adress: 'd1'
}]
*/
// 原始方法
function test(arr) {
  let temp = false
  let tempI
  for (let i = 0; i < list.length; i++) {
    if (list[i].id === arr.id) {
      temp = true
      tempI = i
    }
  }
  if (temp) {
    list[tempI].pic = arr.pic
  } else {
    list.push(arr)
  }
  return list
}
// console.log(test(newArr))
// ES6方法
function test2 (arr) {
  let idx = list.findIndex(n => n.id === arr.id)
  idx > -1 ? list[idx].pic = arr.pic : list.push(arr)
  return list
}
// console.log(test2(newArr))

2.数组对象的完全去重-前面的覆盖后面的

所谓完全去重，是指类似的数组对象也进行去重，只要id相同；
去重数组中的对象, 遇到重复，前面的数组对象覆盖后面的数组对象。

案例模拟

var spread = [{
  id: 16,
  name: "丑柑",
  picType: 0,
  title: "丑柑"
}, {
  id: 16,
  name: "丑柑",
  picType: 0,
  title: "丑柑"
}, {
  id: 11
}, {
  id: 11
}, {
  id: 11,
  name: "丑柑",
  picType: 0,
  title: "丑柑"
},{
  id: 11,
  name: "苹果",
  picType: 0,
  title: "苹果"
}]
// 要求： 输出格式如下
/*
 [{
  "id": 16,
  "name": "丑柑",
  "picType": 0,
  "title": "丑柑"
},{
  "id": 11
}]
*/

解决方法

// lodash方法 unionBy
var result = _.unionBy(spread, 'id')
console.log('结果', result)

3.数组对象的部分去重-前面的覆盖后面的

所谓部分去重，是指类似的数组对象不进行去重，完全一样的数组对象才进行去重；
去重数组中的对象, 遇到重复，前面的数组对象覆盖后面的数组对象。

案例模拟

var spread = [{
  id: 16,
  name: "丑柑",
  picType: 0,
  title: "丑柑"
}, {
  id: 16,
  name: "丑柑",
  picType: 0,
  title: "丑柑"
}, {
  id: 11
}, {
  id: 11
}, {
  id: 11,
  name: "丑柑",
  picType: 0,
  title: "丑柑"
},{
  id: 11,
  name: "苹果",
  picType: 0,
  title: "苹果"
}]
// 要求： 输出格式如下
/*
 [{
  "id": 16,
  "name": "丑柑",
  "picType": 0,
  "title": "丑柑"
},{
  "id": 11
},{
  "id": 11,
  "name": "丑柑",
  "picType": 0,
  "title": "丑柑"
}]

解决方法

// 原始方法
function removeRepeatArrObj (arr) {
  // 创建一个临时变量进行记忆
  var hash = {}
  arr = arr.reduce(function (total, item) {
    // 相同则添加一个空的，不同则push进 累加的数组  --指定id属性
    hash[item.id] = hash[item.id] ? '' : true && total.push(item)
    return total
  }, [])
  return arr
}
console.log(removeRepeatArrObj(spread))
// lodash方法  uniqWith
var result = _.uniqWith(spread, _.isEqual)
console.log(result)

4.数组对象去重-后面的覆盖前面的

案例模拟

var spread = [{
  "id": 1,
  "name": "html",
  "x":1
}, {
  "id": 2,
  "name": "css"
}, {
  "id": 1,
  "name": "javaScript",
  "x": 2
}, {
  "id": 2,
  "name": "javaQuery"
}, {
  "id": 4,
  "name": "vue"
}]
/*
 * 要求: 输出格式如下
[{
  "id": 1,
  "name": "javaScript",
  "x",2
  }, {
    "id": 2,
    "name": "javaQuery"
  },{
    "id": 4,
    "name": "vue"
}]

解决方法

// -守候
function removeRepeatArrObj (arr, key, replaceKey) {
  let objItems = {}, _items = []
  arr.forEach(item => {
    if (!objItems[item[key]]) {
      objItems[item[key]] = item
    } else {
      objItems[item[key]][replaceKey] = item[replaceKey]
    }
  })
  for (let i in objItems) {
    _items.push(objItems[i])
  }
  return _items
}
var result = removeRepeatArrObj(spread, 'id', 'name')
console.log('结果', result)

// jiangzg
function removeRepeatArrObj (arr, key, replaceKey) {
  let temp_object = {}
  arr.forEach(n => temp_object[n.id] = n)
  temp_object = Object.keys(temp_object).map(n => temp_object[n])
  return temp_object
}
var result = removeRepeatArrObj(spread)
console.log('结果', result)