方法一:

双层循环,外层循环元素,内层循环时比较值,如果有相同的值则跳过,不相同则push进数组。

 Array.prototype.distinct = function(){
var arr = this,result = [],i,j,len = arr.length;
for(i = 0; i < len; i++){
for(j = i + 1; j < len; j++){
  if(arr[i] === arr[j]){
        j = ++i;
       }
     }
     result.push(arr[i]);
  }
  return result;
}
var arra = [1,2,3,4,4,1,1,2,1,1,1];
arra.distinct(); //返回[3,4,2,1]

方法二:利用splice直接在原数组进行操作
双层循环,外层循环元素,内层循环时比较值,值相同时,则删去这个值。
注意删除元素之后,需要将数组的长度也减1.

 Array.prototype.distinct = function() {
var arr = this,
i, j, len = arr.length;
for (i = 0; i < len; i++) {
for (j = i + 1; j < len; j++) {
if (arr[i] == arr[j]) {
arr.splice(j, 1);
len--;
j--;
}
}
}
return arr;
};
var a = [1, 2, 3, 4, 5, 6, 5, 3, 2, 4, 56, 4, 1, 2, 1, 1, 1, 1, 1, 1, ];
var b = a.distinct();
console.log(b.toString()); //1,2,3,4,5,6,56

优点:简单易懂
缺点:占用内存高,速度慢

方法三:利用对象的属性不能相同的特点进行去重

 Array.prototype.distinct = function() {
var arr = this,
i, obj = {},
result = [],
len = arr.length;
for (i = 0; i < arr.length; i++) {
if (!obj[arr[i]]) { //如果能查找到,证明数组元素重复了
obj[arr[i]] = 1;
result.push(arr[i]);
}
}
return result;
};
var a = [1, 2, 3, 4, 5, 6, 5, 3, 2, 4, 56, 4, 1, 2, 1, 1, 1, 1, 1, 1, ];
var b = a.distinct();
console.log(b.toString()); //1,2,3,4,5,6,56

方法四:数组递归去重
运用递归的思想,先排序,然后从最后开始比较,遇到相同,则删除。

 Array.prototype.distinct = function() {
var arr = this,
len = arr.length;
arr.sort(function(a, b) { //对数组进行排序才能方便比较
return a - b;
}) function loop(index) {
if (index >= 1) {
if (arr[index] === arr[index - 1]) {
arr.splice(index, 1);
}
loop(index - 1); //递归loop函数进行去重
}
}
loop(len - 1);
return arr;
};
var a = [1, 2, 3, 4, 5, 6, 5, 3, 2, 4, 56, 4, 1, 2, 1, 1, 1, 1, 1, 1, 56, 45, 56];
var b = a.distinct();
console.log(b.toString()); //1,2,3,4,5,6,45,56

方法五:利用indexOf以及forEach

 Array.prototype.distinct = function() {
var arr = this,
result = [],
len = arr.length;
arr.forEach(function(v, i, arr) { //这里利用map,filter方法也可以实现
var bool = arr.indexOf(v, i + 1); //从传入参数的下一个索引值开始寻找是否存在重复
if (bool === -1) {
result.push(v);
}
})
return result;
};
var a = [1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 2, 3, 3, 2, 2, 1, 23, 1, 23, 2, 3, 2, 3, 2, 3];
var b = a.distinct();
console.log(b.toString()); //1,23,2,3

方法六:利用ES6的set
Set数据结构,它类似于数组,其成员的值都是唯一的。利用Array.from将Set结构转换成数组。

 function dedupe(array) {
return Array.from(new Set(array));
}
dedupe([1, 1, 2, 3]) //[1,2,3]

拓展运算符(...)内部使用for...of循环

 let arr = [1,2,3,3];
let resultarr = [...new Set(arr)];
console.log(resultarr); //[1,2,3]

下面给大家补充介绍合并数组并去重的方法

一、concat()方法
思路:concat() 方法将传入的数组或非数组值与原数组合并,组成一个新的数组并返回。该方法会产生一个新的数组。

 function concatArr(arr1, arr2){
  var arr = arr1.concat(arr2);
  arr = unique1(arr);//再引用上面的任意一个去重方法
  return arr;
}

二、Array.prototype.push.apply()
思路:该方法优点是不会产生一个新的数组。

var a = [1, 2, 3];
var b = [4, 5, 6];
Array.prototype.push.apply(a, b);//a=[1,2,3,4,5,6]
  //等效于:a.push.apply(a, b);
  //也等效于[].push.apply(a, b);
function concatArray(arr1,arr2){
   Array.prototype.push.apply(arr1, arr2);
     arr1 = unique1(arr1);
     return arr1;
}

JS实现数组去重的6种方法总结的更多相关文章

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

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

  2. js实现数组去重的几种方法

    1.简单结构的数组,例如[1,2,3,3,4],使用es6提供的Set和Array.from Set:是一种新的数据结构,可以接收一个数组或者是类数组对象,自动去重其中的重复项目. 类数组对象:只包含 ...

  3. JavaScript中数组去重的几种方法

    JavaScript中数组去重的几种方法 正常情况下,数据去重的工作一般都是由后端同事来完成的,但是前端也要掌握好处理数据的能力,万一去重的工作交给我们大前端处理,我们也不能怂呀.现在我总结了一些去重 ...

  4. JavaScript数组去重的几种方法

    这个老问题,网上普遍都有了,为什么要再写一遍呢,主要是为了记个笔记... 遍历时搜索结果数组 思路很明确,如下 新建一个数组存放结果 循环遍历原数组,对于每一个元素,在结果数组中搜索是否存在 若不存在 ...

  5. JavaScript数组去重的四种方法

    今天,洗澡的想一个有趣的问题,使用js给数组去重,我想了四种方法,虽然今天的任务没有完成,5555: 不多说,po代码: //方法一:简单循环去重    Array.prototype.unique1 ...

  6. js数组去重的4种方法

    js数组去重,老生长谈,今天对其进行一番归纳,总结出来4种方法 贴入代码前 ,先对浏览器Array对象进行支持indexOf和forEach的polyfill Array.prototype.inde ...

  7. JS数组去重的9种方法(包括去重NaN和复杂数组类型)

    其实网上已经有很多js数组的去重方法,但是我看了很多篇并自己通过代码验证,发现都有一些缺陷,于是在研究多篇代码之后,自己总结了9种方法,如果有哪里不对请及时纠正我哈~ 转载请表明出处 测试代码 let ...

  8. js数组去重的几种方法

    1.遍历数组法 最简单的去重方法, 实现思路:新建一新数组,遍历传入数组,值不在新数组就加入该新数组中:注意点:判断值是否在数组的方法“indexOf”是ECMAScript5 方法,IE8以下不支持 ...

  9. Js 数组去重的几种方法总结

           去重是开发中经常会碰到的一一个热点问题,不过目前项目中碰到的情况都是后台接口使用SQL去重,简单高效,基本不会让前端处理去重.那么前端处理去重会出现什么情况呢?假如每页显示10条不同的数 ...

随机推荐

  1. Android开发-Listview中显示不同的视图布局

    1. 使用场景 在重写ListView的BaseAdapter时,我们常常在getView()方法中复用convertView,以提高性能.convertView在Item为单一的同种类型布局时,能够 ...

  2. Oracle 中PLSQL的ftp应用

    CREATE OR REPLACE PACKAGE BODY ftp AS -- ----------------------------------------------------------- ...

  3. FilterDispatcher is depredated!plesae use the new filters

    一些struts2的教程都是比较早的,当我们基于较新版本的struts2来实现代码的时候,往往会出现一些问题.比如这个警告:FilterDispatcher isdeprecated! 在web.xm ...

  4. 【一天一道LeetCode】#72. Edit Distance

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Given t ...

  5. JAVA集合类——难得的总结

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/41346969 以下资料是在学习中总结出来的,希望对你有所帮 ...

  6. [java]Windows 7 配置jdk 1.7环境变量

     来自百度文库 Windows 7 配置jdk 1.7环境变量 环境:win7(32位)64位和下面差不多      jdk1.7 1.右击计算机-属性-高级系统设置-高级-环境变量,弹出&quo ...

  7. html案例详解(一)

    一.入门. <html> <!-- 头信息的作用 1. 可以设置网页的标题. 2. 可以通知浏览使用指定的码表解释html页面. 3. --> <head> < ...

  8. ORA-04091错误原因与解决方法

    最近工作中写了一触发器报错:ORA-04091:table XX  is mutating, trigger/function may not see it. 下面通过官方文档及网友提供资料分析一下错 ...

  9. 被final关键字坑了

    一直都傻傻的以为用final关键字定义的都是不可变的.没想到的是对基本类型来说,这是一直成立的. 但是对于final修饰的对象,仍然可以修改对象里面的对象和成员变量.不变的只是当前对象的地址. 昨天我 ...

  10. Google性能工程师Ilya Grigorik谈HTTP/2

    via:http://www.infoq.com/cn/news/2014/11/http2-develop HTTP/2,也就是超文本传输协议第2版,是下一代HTTP协议.该版本是自1999年HTM ...