在实际工作或面试中,我们经常会遇到“数组去重”问题,接下来就是使用js实现的数组去重的多种方法:


1.借助ES6提供的Set结构

    var arr = [1,1,2,2,3,3,4,4,5,5,4,3,2,1,1,1];
console.log(arr); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 2, 1, 1, 1]
function noRepeat11(arr){
var newArr = [];
var myset = new Set(arr);//利用了Set结构不能接收重复数据的特点
for(var val of myset){
newArr.push(val)
}
return newArr;
}
var arr2 = noRepeat11(arr)
console.log(arr2); //[1, 2, 3, 4, 5]

2.借助indexOf()方法判断此元素在该数组中首次出现的位置下标与循环的下标是否相等

    var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5];
console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5]
function noRepeat2(arr) {
for (var i = 0; i < arr.length; i++) {
if (arr.indexOf(arr[i]) != i) {
arr.splice(i,1);//删除数组元素后数组长度减1后面的元素前移
i--;//数组下标回退
}
}
return arr;
}
var newArr = noRepeat2(arr);
console.log(newArr); //[1, 23, 3, 5, 6, 7, 9, 8]

3.利用数组中的filter方法

    var arr = ['apple','banana','pear','apple','orange','orange'];
console.log(arr) //["apple", "banana", "pear", "apple", "orange", "orange"]
var newArr = arr.filter(function(value,index,self){
return self.indexOf(value) === index;
});
console.log(newArr); //["apple", "banana", "pear", "orange"]

4.借助新数组 通过indexOf方判断当前元素在数组中的索引如果与循环的下标相等则添加到新数组中

    var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5];
console.log(arr) //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5]
function noRepeat4(arr) {
var ret = [];
for (var i = 0; i < arr.length; i++) {
if (arr.indexOf(arr[i]) == i) {
ret.push(arr[i]);
}
}
return ret;
}
var arr2 = noRepeat4(arr);
console.log(arr2); //[1, 23, 3, 5, 6, 7, 9, 8]

5.利用空对象来记录新数组中已经存储过的元素

    var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
console.log(arr) //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
var obj={};
var newArr=[];
for(var i=0;i<arr.length;i++){
if(!obj[arr[i]]){
obj[arr[i]]=true;
newArr.push(arr[i]);
}
}
console.log(newArr); //[1, 23, 3, 5, 6, 7, 9, 8]

6.借助新数组,判断新数组中是否存在该元素如果不存在则将此元素添加到新数组中

    var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
function noRepeat6(arr){
var newArr = [];
for(var i = 0; i < arr.length; i++){
if(newArr.indexOf(arr[i]) == -1){
newArr.push(arr[i]);
}
}
return newArr;
}
var arr2 = noRepeat6(arr);
console.log(arr2); //[1, 23, 3, 5, 6, 7, 9, 8]

7.借助新数组,判断新数组中是否存在该元素如果不存在则将此元素添加到新数组中(原数组长度不变但被按字符串顺序排序)

    var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
function noRepeat7(arr) {
var ret = [],
end;//临时变量用于对比重复元素
arr.sort();//将数重新组排序
end = arr[0];
ret.push(arr[0]);
for (var i = 1; i < arr.length; i++) {
if (arr[i] != end) {//当前元素如果和临时元素不等则将此元素添加到新数组中
ret.push(arr[i]);
end = arr[i];
}
}
return ret;
}
var arr2 = noRepeat7(arr);
console.log(arr2); //[1, 23, 3, 5, 6, 7, 8, 9]

8.双层循环改变原数组

    var arr = [1,1,2,2,3,3,4,4,5,5,4,3,1,2,6,6,6,6];
console.log(arr); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 1, 2, 6, 6, 6, 6]
function noRepeat9(arr){
for (var i = 0; i < arr.length; i++) {
for (var j = 0; j < arr.length; j++) {
if (arr[i] == arr[j] && i != j) {//将后面重复的数删掉
arr.splice(j, 1);
}
}
}
return arr;
}
var arr2 = noRepeat9(arr);
console.log(arr2); //[1, 2, 3, 4, 5, 6]

9.将数组的每一个元素依次与其他元素做比较,发现重复元素,删除

    var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5];
console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5, 5]
function noRepeat1(arr) {
for(var i = 0; i < arr.length-1; i++){
for(var j = i+1; j < arr.length; j++){
if(arr[i]===arr[j]){
arr.splice(j,1);
j--;
}
}
}
return arr;
}
var arr2 = noRepeat1(arr);
console.log(arr2); //[1, 23, 3, 5, 6, 7, 9, 8]

10.借助新数组

    var arr = [1,1,2,2,3,3,4,4,5,5,4,3,2,1,1,1];
console.log(arr); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 2, 1, 1, 1]
var newArr = [];
for (var i = 0; i < arr.length; i++) {
var repArr = [];//接收重复数据后面的下标
//内层循环找出有重复数据的下标
for (var j = i + 1; j < arr.length; j++) {
if (arr[i] == arr[j]) {
repArr.push(j);//找出后面重复数据的下标
}
}
//console.log(repArr);
if (repArr.length == 0) {//若重复数组没有值说明其不是重复数据
newArr.push(arr[i]);
}
}
console.log(newArr); //[5, 4, 3, 2, 1]

js中数组去重的方法的更多相关文章

  1. js中数组去重的几种方法

    js中数组去重的几种方法         1.遍历数组,一一比较,比较到相同的就删除后面的                 function unique(arr){                 ...

  2. js中数组去重方法及性能对比

    js中数组的 数组去重 常用的数组去重方法以及效率分析: 首先我们先构建一个数组,主要是用于进行去重实验,我们主要实验的量级为1000,10000,100000,500000.具体的生成数组的方法如下 ...

  3. JS中数组去重的九方法

            数组去重方法        方法一:运用set结构特点:存储的数据没有重复的,结果为对象,再用Array.from()转换成数组   var arr = [1,1,2,1,3,4,5] ...

  4. js对数组去重的方法总结-(2019-1)

    最近待业在家,系统地学习了一套js的课程.虽然工作时间真的比较长了,但有些东西只局限在知其然而不知其所以然的程度上,有些知识点通过“血和泪”的经验积累下来,也只是记了结果并没有深究,所以每次听完课都有 ...

  5. JS实现数组去重的方法

    1.使用ES6的Set进行去重 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...

  6. js中数组的检测方法

    在js中可以使用Object.prototype.toString.call()的来检测一个对象是否为一个数组 //检测数组 var a = [1, 2]; console.log(typeof a) ...

  7. JS中数组的迭代方法和归并方法

    昨天总结的JavaScript中的数组Array方法 数组的迭代方法 ES5中为数组定义了5个迭代方法.每个方法都要接收两个参数:要在每一项上面运行的函数和(可选的)运行该函数的作用域对象---影响t ...

  8. JS实现数组去重的方法(6种)

    方法一: 双层循环,外层循环元素,内层循环时比较值 如果有相同的值则跳过,不相同则push进数组 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 Arra ...

  9. JS中数组的拷贝方法

    之前在写一个vue的计算属性时,大概是这样: computed: { updateList () { let newList = this.List /*do something*/ return n ...

随机推荐

  1. SQL语句中LEFT JOIN ON WHERE和LEFT JOIN ON AND的区别

    先上代码: declare @tb table (name varchar(10),sex int) declare @tb2 table (name varchar(10),age int) ins ...

  2. ML第3周学习小结

    本周收获 总结一下本周学习内容: 1.学习了<深入浅出Pandas>的第五章:Pandas高级操作的三个内容 复杂查询 数据类型转换 数据排序 我的博客链接: Pandas复杂查询.数据类 ...

  3. Spire.Office激活

    更新记录: 2022年5月28日 初始代码便于复用 注意:最多支持到:E-ICEBLUE Spire.Office Platinum v6.10.3 引入命名空间: using Spire.Licen ...

  4. JAVA面向对象之封装和调用

    一   面向对象 面向对象的三大特性   1 封装:概念:封装是把过程和数据私有化,打包封存起来,对数据访问只能通过指定的方式.简单的可以理解为你把钱存到银行里,银行专员首先要给你开一个账户,之后你的 ...

  5. Java多线程下载分析

    为什么要多线程下载 俗话说要以终为始,那么我们首先要明确多线程下载的目标是什么,不外乎是为了更快的下载文件.那么问题来了,多线程下载文件相比于单线程是不是更快? 对于这个问题可以看下图. 横坐标是线程 ...

  6. python小题目练习(二)

    题目:输出1-100之间不包括7的倍数,含有7的数的其他数 """Author:mllContent:输出1-100之间不包括7的倍数,含有7的数的其他数Date:202 ...

  7. 从Mpx资源构建优化看splitChunks代码分割

    背景 MPX是滴滴出品的一款增强型小程序跨端框架,其核心是对原生小程序功能的增强.具体的使用不是本文讨论的范畴,想了解更多可以去官网了解更多. 回到正题,使用MPX开发小程序有一段时间了,该框架对不同 ...

  8. PMP 考试常见工具与技术点总结

    转载请注明出处: 网络图:项目进度活动之间的逻辑关系,用来推算关键路径,最大浮动时间等: 横道图(甘特图):以图示的方式,通过活动列表和时间刻度,来展示项目获得那个顺序和持续时间 责任分配矩阵:每件事 ...

  9. 服务器与Ajax

    前端相关的技术点 HTML   主要用来实现页面的排版布局 CSS   主要用来实现页面的样式美化 JavaScript   主要用来实现前端功能特效 Ajax基础知识铺垫 客户端与服务器 通信协议( ...

  10. CSS进阶内容—浮动和定位详解

    CSS进阶内容-浮动和定位详解 我们在学习了CSS的基本知识和盒子之后,就该了解一下网页的整体构成了 当然如果没有学习之前的知识,可以到我的主页中查看之前的文章:秋落雨微凉 - 博客园 CSS的三种布 ...