摘要:1、遍历 + Array.prototype.indexOf 去重。2、对于纯数字,纯字符数组,可以利用 js 对象特性,对象键唯一且是字符。

脚本宝典收集整理的这篇文章主要介绍了

js实例教程-js数组去重的四种方式介绍

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。

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]

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]

觉得可用,就经常来吧!Javascript技巧 脚本宝典 欢迎评论哦! js技巧,巧夺天工,精雕玉琢。小宝典献丑了!

总结

以上是脚本宝典为你收集整理的

js实例教程-js数组去重的四种方式介绍

全部内容,希望文章能够帮你解决

js实例教程-js数组去重的四种方式介绍

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过