js数组去重的四种方式介绍
程序员文章站
2022-08-31 12:59:16
1、遍历 + array.prototype.indexof 去重。
var arr = [1, '1', 1, 'str', nan, na...
1、遍历 + array.prototype.indexof 去重。
var arr = [1, '1', 1, 'str', nan, nan, null, null, undefined, undefined]; function deleteduplicate(a) { if( object.prototype.tostring.call( a ) !== '[object array]' || !a.length ) { return a;//非数组、空数组直接返回 } var tmp = [ a[0] ];//存储原数组第一个元素 for(var i = 1; i < a.length; i++) {//从第二个开始遍历 if( tmp.indexof( a[i] ) === -1 ) { tmp.push( a[i] ); } } return tmp; } deleteduplicate( arr ); //[1, "1", "str", nan, nan, null, undefined] //无法去重 nan,可以使用 es2016 引进的数组方法 //[1, 2, nan].includes( nan ) === true
2、对于纯数字,纯字符数组,可以利用 js 对象特性,对象键唯一且是字符。
var arr = [1, 2, 4, 2, 4, 3, 1]; function deleteduplicate(a) { if( object.prototype.tostring.call( a ) !== '[object array]' || !a.length ) { return a; } var obj = {}, tmp = []; for(var i = 0; i < a.length; i++) { obj[ a[i] ] = a[i]; } for( var key in obj ) { tmp.push( obj[key] ); } return tmp; } deleteduplicate( arr ); //[1, 2, 3, 4] //由于传统对象的键为字符,obj[1] 和 obj['1'] 是一样的效果,且无法保证原始顺序
3、es6 提供了 map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,object 结构提供了“字符串—值”的对应,map 结构提供了“值—值”的对应,是一种更完善的 hash 结构实现。如果你需要“键值对”的数据结构,map 比 object 更合适,并且 map 的遍历顺序就是插入顺序。
let arr = [nan, 1, [1], [1], 1, '1', 4, 1, 2, 4, 5, 5, nan, nan, null, null, undefined, undefined]; function deleteduplicate(a) { if( !array.isarray( a ) || !a.length ) { return a; } let map = new map(); a.foreach( value => map.set(value, value) ); return array.from( map.values() );// return [ ...map.values() ]; } deleteduplicate( arr ); //[nan, 1, array(1), array(1), "1", 4, 2, 5, null, undefined] //map 的遍历顺序就是插入顺序
4、es6 提供了新的数据结构 set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
let arr = [nan, 1, [1], [1], 1, '1', 4, 1, 2, 4, 5, 5, nan, nan, null, null, undefined, undefined]; function deleteduplicate(a) { if( !array.isarray( a ) || !a.length ) { return a; } let set = new set( a ); return array.from( set );// return [ ...set ]; } deleteduplicate( arr ); //[nan, 1, array(1), array(1), "1", 4, 2, 5, null, undefined]
上一篇: jQuery treepanel动态加载数据实现代码
下一篇: LVS详解