javascript|JS数组去重的几种方法
数组去重
1 双层for循环（类似冒泡排序的双层循环写法）
var arr = [2,3,4,2,34,21,1,12,3,4,1]
for(var i =0;
i2 循环和indexof、循环和includes
【javascript|JS数组去重的几种方法】创建新数组，循环旧数组，看每次循环的元素是否存在于新数组中没有就把当前元素添加到新数组中
//indexof
var arr = [2,3,4,2,34,21,1,12,3,4,1]
var arr2 = []
arr.forEach((e)=>{if(arr2.indexOf(e)==-1){arr2.push(e)
}
})
console.log(arr2)
//arr2:[1, 2, 3, 4, 12, 21, 34]
//includes
var arr = [2,3,4,2,34,21,1,12,3,4,1]
var arr2 = []
arr.forEach((e)=>{if(!arr2.includes(e)){arr2.push(e)
}
})
console.log(arr2)
//arr2:[1, 2, 3, 4, 12, 21, 34]
3 利用对象属性不能重复去重
var arr = [2,3,4,2,34,21,1,12,3,4,1]
var obj = {
};
arr.forEach((e,i)=>{obj[arr[i]] = "abc";
});
var arr2=Object.keys(obj)
console.log(arr2)
//arr2:["1", "2", "3", "4", "12", "21", "34"]
var arr3 = arr2.map(e => ~~e )
//arr3:[1, 2, 3, 4, 12, 21, 34]
//注意这种方法不仅给数组重新排列而且还改变了数组中元素的类型
~是js里的按位取反操作符，~~就是执行两次按位取反，其实就是保持原值，但是注意虽然是原值，但是对布尔型变量执行这个操作，会转化成相应的数值型变量，也就是 ~~true === 1，~~false === 0。4 ES6 Set
ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。
var arr = [2,3,4,2,34,21,1,12,3,4,1]
var arr1 = [...new Set(arr)]
console.log(arr1)
//arr1:[1, 2, 3, 4, 12, 21, 34]
5 ES6 Array. prototype.filter()
注：indexOf在数组中找元素的时候，碰到符合条件的第一个就会把它的下标返回
var arr = [2,3,4,2,34,21,1,12,3,4,1]
var arr2 = arr.filter((e,i)=>{//看每次循环的元素在数组中出现的第一个下标位置（indexOf返回的位置），和每次循环的元素的下标（filter循环每次的i）是否一致，一致就说明他就是第一个符合条件，不会被过滤掉。
return arr.indexOf(e)==i;
})
console.log(arr2)
//arr2:[1, 2, 3, 4, 12, 21, 34]
6 ES6 Array. prototype.reduce()
var arr = [2,3,4,2,34,21,1,12,3,4,1]
var arr2 = arr.reduce((pre,e)=>{//这里当然也可以用indexOf来判断是否存在
pre.includes(e)?pre:pre.push(e);
return pre
},[])
console.log(arr2)
//arr2:[1, 2, 3, 4, 12, 21, 34]
推荐阅读
- 远去的风筝
- 奔向你的城市
- 事件代理
- Eddy小文
- NO.38|NO.38 我不是嫁不出去，而是不想嫁
- 好想，找个大海去裸奔…
- 怎样用黑谜速冻膜去黑头，|怎样用黑谜速冻膜去黑头， 最有效的去黑头的方法看这!
- 下雪了，飞去你的城市拥抱你|下雪了，飞去你的城市拥抱你 | 有个直男向我表白了
- 如何更好的去学习
- 数组常用方法一