JS数组去重的6种方法完整实例

时间：2021-05-26

本文实例讲述了JS数组去重的6种方法。分享给大家供大家参考，具体如下：

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>www.jb51.net 数组去重</title> </head> <body> <script> //1.filter:(indexOf)方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素, filter() 不会对空数组进行检测。 filter() 不会改变原始数组。 var arr1 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var arr1_1 = arr1.filter(function(m, n) { return arr1.indexOf(m) == n; }) document.write(arr1_1 + "<br />"); //2.map:(push indexOf)把每个元素通过函数传递到当前匹配集合中，生成包含返回值的新的 jQuery 对象。 var arr2 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var arr2_2 = []; arr2.map(function(m, n) { if(arr2.indexOf(arr2[n]) == n) { arr2_2.push(m); } }); document.write(arr2_2 + "<br />"); //3.indexOf(push)搜索数组中的元素，并返回它所在的位置。 var arr3 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var arr3_3 = []; for(var i = 0; i < arr3.length; i++) { if(arr3_3.indexOf(arr3[i]) == -1) { arr3_3.push(arr3[i]); } } document.write(arr3_3 + "<br />"); //4.splice对数组进行删除、插入、替换，是最强大的数组方法。改变原数组 var arr4 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; for(var i = 0; i < arr4.length; i++) { for(var j = i + 1; j < arr4.length; j++) { if(arr4[i] == arr4[j]) { arr4.splice(j, 1) j--; //别忘记减 } } } document.write(arr4 + "<br />"); //5.push(数组去重一一对比)添加到数组末尾 var arr5 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; function remm(arr) { var arr5_5 = []; for(var i = 0; i < arr5.length; i++) { for(var j = 0; j < arr5.length; j++) { if(arr5[i] == arr5_5[j]) { break; } } if(arr5[i] != arr5_5[j]) { arr5_5.push(arr5[i]); } } return arr5_5; } document.write(remm(arr5) + "<br />"); //6.set数据结构Set类似于数组，但是成员的值都是唯一的，没有重复的值。用set.size表示伪数组长度 var arr6= [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var set = new Set(arr6); var newArr = new Array(...set); document.write(newArr+"<br />"); </script> </body></html>

使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试上述代码，可得到如下运行结果：

PS：这里再为大家提供几款相关工具供大家参考使用：

在线去除重复项工具：
http://tools.jb51.net/code/quchong

在线文本去重复工具：
http://tools.jb51.net/aideddesign/txt_quchong

更多关于JavaScript相关内容还可查看本站专题：《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript错误与调试技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章