【javascript】数组以及json去重方式

---

一、传统方式，使用for循环

传统方式兼容性最高，但是indexOf本质上也是在遍历，相当于遍历了两次，所以如果数据量大，计算效率相对低一些。

function unique(arr) {
 // 定义一个新数组
  const newArr = [];

  arr.forEach((i) => {
    // 利用indexOf来判断newArr中有没有arr中的元素，有的话返回1，没有返回-1
  	// 这里的indexOf相当于在遍历newArr中的每一项,所以计算效率相对较低
    if (newArr.indexOf(i) < 0) {
     // 如果newArr中没有,那么就把这个元素push到newArr中,实现去重
      newArr.push(i);
    }
  });

  return newArr;
}

二、使用set

使用set去重是利用了set不可重复的特性来实现，这个方法相对传统方式来说计算效率要高，所以如果浏览器支持，用set比较合适。

function unique(arr) {
  // set本身是具有无序，不能重复的特性
  const set = new Set(arr);
  return [...set];
}

三、使用lodash库

安装lodash库

npm i lodash --save

在页面中使用lodash库，uniq可以去除只有一个层级的对象，uniqBy可以去重json格式的对象

import { uniq, uniqBy } from "lodash";

export default {
	methods:{
		deepClone() {
			const arr= [ 1, 2, 3, 3, 1, 4]
			uniq(arr)
			console.log(arr) // [1,2,3,4]

      		const json= [{ 'x': 1 }, { 'x': 2 }, { 'x': 1 }]
			uniqBy(json, 'x')
			console.log(arr) // [{ 'x': 1 }, { 'x': 2 }]
		}
    }
}

---

总结

如果不考虑兼容性，建议使用set来去重，这种方式简单，效率高，当然也可以使用lodash库，使用lodash库来去重json格式的对象是特别方便的，避免自己手写考虑不到的地方