一、纯数组
1. 纯数组 - 利用new Set()集合
Array.from(new Set(arr));
Set是es6新增的数据结构,似于数组,但并非真正的数组,我们可以称之为类数组对象,它的一大特性就是所有元素都是唯一的,没有重复的值。
Array.from的作用是
允许在 JavaScript 集合(如: 数组、类数组对象、或者是字符串、map 、set 等伪数组对象或可迭代对象) 上进行有用的转换。
我们可以利用Set的特性,进行去重,最后使用Array.from()将类数组对象转化成真正的数组。
2. 纯数组 - 利用filter()+indexOf()
arr.filter((item, index) => arr.indexOf(item) === index);
filter函数的作用是遍历数组并返回符合条件的元素组成的数组,第一个参数是数组元素,第二个参数是索引。
indexOf的作用是查询并返回数组中第一个符合条件的元素的索引。
两个方法组合起来,filter循环遍历数组,indexOf判断当前元素在数组中第一次出现的位置是否等于当前索引,如果等于(说明第一次出现)就返回true,如果不等于(说明该元素是重复的元素)返回false,通过filter过滤获得去重后的数组。
3. 纯数组 - 利用reduce()+includes()
arr.reduce((total, item) => (total?.includes(item) ? total : [...total, item]) , []);
reduce是一个累加器,第一个参数是回调函数,第二个参数是累加器但默认值。回调函数中第一个参数是累加的数组,第二个参数是遍历的元素,返回值是累加器的值。
includes用于查找数组中书否存在符合条件的元素,如果存在返回true,如果不存在返回false。
设置reduce累加器的默认值为空数组,开始遍历数组,通过includes判断累加器中是否存在当前元素,如果当前元素在累加器中不存在,就把它添加到累加器中,并返回出去,如果当前元素已经存在,直接把累加器返回出去,实现去重。
二、数组对象
1.数组对象 - 利用new Set()集合
Array.from(new Set(arr.map((item) => JSON.stringify(item)))).map(item=>JSON.parse(item))
Set是es6新增的数据结构,似于数组,但并非真正的数组,我们可以称之为类数组对象,它的一大特性就是所有元素都是唯一的,没有重复的值。
Array.from的作用是
允许在 JavaScript 集合(如: 数组、类数组对象、或者是字符串、map 、set 等伪数组对象或可迭代对象) 上进行有用的转换。
JSON.stringify():将数据格式转化成JSON字符串格式
JSON.parse():将JSON字符串转化成数据格式
Set对象只能对简单的数组去重,无法对数组对象去重,我们可以遍历数组并通过JSON.stringify()将数组元素转化成JSON字符串,此时数组变成字符串组成的数组,通过Set特性去重,去重之后通过Array.form转化成真数组,最后遍历数组并通过JSON.parse将字符串转化成对象,实现数组去重。
2.数组对象 - 利用filter()+findIndex()
arr.filter((item,index)=>item?.findIndex( i => i.id===item.id ) === index)
filter函数的作用是遍历数组并返回符合条件的元素组成的数组,第一个参数是数组元素,第二个参数是索引。
findIndex的作用是遍历数组,查询并返回数组中第一个符合条件的元素的索引。
两个方法组合起来,filter循环遍历数组,findIndex遍历数组,根据id判断当前元素的在数组中第一次出现的位置是否等于当前索引,如果等于(说明第一次出现)就返回true,如果不等于(说明该元素是重复的元素)返回false,通过filter过滤获得去重后的数组。
3.数组对象 - 利用reduce()+some()
arr.reduce((total,item)=>total?.some( i => i.id===item.id ) ? total : [...total,item] , [] )
reduce是一个累加器,第一个参数是回调函数,第二个参数是累加器但默认值。回调函数中第一个参数是累加的数组,第二个参数是遍历的元素,返回值是累加器的值。
some遍历数组,判断数组中否存在符合条件的元素,如果存在返回true,如果不存在返回false。
设置reduce累加器的默认值为空数组,开始遍历数组,通过some遍历累加器,判断累加器中当前元素的id是否存在,如果不存在,就把它添加到累加器中,并返回出去,如果当前id已经存在,直接把累加器返回出去,实现去重。
本篇文章只是介绍一些简单的去重方法,其实数组去重的方法有很多,大家自行摸索~~~