javascript数组去重常用方法实例分析

本文实例讲述了javascript数组去重常用方法。分享给大家供大家参考,具体如下:

数组去除重复值是面试常考内容,也是很容易用到的一个技巧,下面就几种去重的方法进行介绍。

首先是最常见的方法,也就是添加一个临时数组,将原数组遍历,加入临时数组,每次加入时判断待加入的元素是否存在于临时数组中,代码如下:

// 对数组进行去重操作,只考虑数组中元素为数字或字符串,返回一个去重后的数组
//第一种方法,遍历,将没有的插入临时数组
function uniqArray1(arr) {
  var n=[];
  for(var i=0;i<arr.length;i++){
    //如果当前项已经保存到了临时数组,则跳过,否则加入
    if(n.indexOf(arr[i])==-1){
      n.push(arr[i]);
    }
  }
  return n;
}

那么还有没有更好的办法呢?可以采用哈希表的思想,在JavaScript中,对象的查找比数组下标的查找要快很多倍。所以我们可以创建一个对象专门来存放已加入临时数组的元素,那么每次加入新的元素时就可以通过查找对象来判断是否重复了,代码如下:

//第二种方法,使用哈希表
function uniqArray2(arr){
  var n={},//哈希表
    r=[];//零时数组
  for(var i=0;i<arr.length;i++){
    if(n[arr[i]]==null){//如果哈希表中没有,则添加到哈希表,且进入临时数组
      n[arr[i]]=true;
      r.push(arr[i]);
    }
  }
  return r;
}

还有一种方法,虽然速度没有哈希表快,但是比最基本的indexOf来的快,思想就是先经过排序函数sort,再比较相邻的元素,不同的就加到临时数组中。代码如下:

//第三种方法,先排序,再比较邻接部分
function uniqArray3(arr){
  arr.sort();
  var r=[arr[0]];
  for(var i=1;i<arr.length;i++){
    if(arr[i]!=r[r.length-1]){//由于已经经过了排序,所以相邻的是相同的
      r.push(arr[i]);
    }
  }
  return r;
}

最后实验代码如下:

//验证数组去重函数的使用
var arr=[2,3,4,2,4,5,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3];
for(var i=0;i<10000000;i++){//为了分辨出花费时间的区别,特此增加数组的长度
  arr.push(3);
}
var time1=Date.now();
var n1=uniqArray1(arr);
var time2=Date.now();
console.log(n1);//2,3,4,5说明第一种去重成功
console.log(time2-time1);//218
time1=Date.now();
var n2=uniqArray2(arr);
time2=Date.now();
console.log(n2);//2,3,4,5说明第二种去重成功
console.log(time2-time1);//63,说明对象下标的引用要比indexOf搜索快得多
time1=Date.now();
var n3=uniqArray3(arr);
time2=Date.now();
console.log(n3);//2,3,4,5说明第三种去重成功
console.log(time2-time1);//203,说明sort方法使用快排,比indexOf快,但是没有哈希快

可以看到哈希算法的速度是最快的。

PS:这里再为大家提供几款去重复工具供大家参考使用:

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

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

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript数组操作技巧总结》、《JavaScript排序算法总结》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript查找算法技巧总结》及《JavaScript错误与调试技巧总结》

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

时间: 2017-04-10

JavaScript数据结构中栈的应用之表达式求值问题详解

本文实例讲述了JavaScript数据结构中栈的应用之表达式求值问题.分享给大家供大家参考,具体如下: 下面来谈一个比较经典的表达式求值问题,这个问题主要是设计到操作符的优先级.我们通常看到的表达式都是中缀表达式,存在很多优先级差别,而后缀表达式则没有这些优先级问题.下面先看看两种表达式的区别. 中缀表达式:a*b+c*d-e/f      后缀表达式:ab*cd*+ef/- 从中缀表达式转换到后缀表示式是很难实现的,我们这里可以通过栈的思想来实现.下面进行详细的介绍是什么样的思想: 在对一个中

JS简单实现数组去重的方法示例

本文实例讲述了JS简单实现数组去重的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>JS数组去重</title> <meta http-equiv=&

JavaScript数组实现数据结构中的队列与堆栈

一.队列和堆栈的简单介绍 1.1.队列的基本概念 队列:是一种支持先进先出(FIFO)的集合,即先被插入的数据,先被取出! 如下图所示: 1.2.堆栈的基本概念 堆栈:是一种支持后进先出(LIFO)的集合,即后被插入的数据,先被取出! 如下图所示: 二. 在JavaScript中实现队列和堆栈 在JavaScript中实现队列和数组主要是通过数组,js数组中提供了以下几个方法可以让我们很方便实现队列和堆栈: •shift:从数组中把第一个元素删除,并返回这个元素的值. •unshift: 在数组

JavaScript数据结构中串的表示与应用实例

本文实例讲述了JavaScript数据结构中串的表示与应用.分享给大家供大家参考,具体如下: 类似于线性表的顺序存储结构,用一组地址连续的存储单元存储串值的字符序列.下面我们以串联接为例,讲解一下这种存储结构时串的操作.JavaScript自带有concat方法,该方法返回字符串值,该值包含了两个或多个提供的字符串的连接. 其实思路很简单,就是将第二个串拼接在第一个串后面,代码如下 <!DOCTYPE html> <html> <head> <meta chars

javascript数据结构中栈的应用之符号平衡问题

本文实例讲述了javascript数据结构中栈的应用之符号平衡问题.分享给大家供大家参考,具体如下: 由于栈先进后出的结构,我们可以将其作为有用的工具,下面就介绍一下栈的应用. 首先是符号的平衡问题.有一串字符串,我们需要判断其中固定的字符是否成对出现,比如<> {} [] () 等.当然实现的方法有很多,但是采用栈的实现会相对更加简单. 实现上述算法的JavaScript代码如下 <!DOCTYPE html> <html> <head> <meta

js数组与字符串的相互转换方法

熟悉js的朋友很多都遇到过js的数组与字符串相互转换的情况,本文就此作一简单介绍,示例如下: 一.数组转字符串 需要将数组元素用某个字符连接成字符串,示例代码如下: var a, b; a = new Array(0,1,2,3,4); b = a.join("-"); 二.字符串转数组 实现方法为将字符串按某个字符切割成若干个字符串,并以数组形式返回,示例代码如下: var s = "abc,abcd,aaa"; ss = s.split(","

JavaScript队列的应用实例详解【经典数据结构】

本文实例讲述了JavaScript队列的应用.分享给大家供大家参考,具体如下: 和前面介绍的栈相反,队列是一种先进先出的线性表,它只允许在表的一端进行插入,而在另一端进行删除.JavaScript自己提供了两个队列方法shift和push方法,分别是出队和入队,其原理就是将元素插入数组最后一个和删除第一个元素. 这里需要注意一点,就是unshift方法的效率比push的效率要低很多.因为它要将入队之前的数组全部往前移动一位.这里我们就不用代码再次演示了. 和线性表类似,队列也分为顺序队列和链队列

Js数组的操作push,pop,shift,unshift等方法详细介绍

js中针对数组操作的方法还是比较多的,今天突然想到来总结一下,也算是温故而知新吧.不过不会针对每个方法进行讲解,我只是选择其中的一些来讲. 首先来讲一下push和pop方法,这两个方法只会对数组从尾部进行压入或弹出,而且是在原数组进行操作,任何的改动都是会影响到操作的数组.push(args)可以每次压入多个元素,并返回更新后的数组长度.pop()函数每次只会弹出最后一个结尾的元素,并返回弹出的元素,如果是对空组数调用pop()则返回undefined. 如果参数是数组则是将整个数组当做一个元素

javascript数据结构之串的概念与用法分析

本文实例讲述了javascript数据结构之串的概念与用法.分享给大家供大家参考,具体如下: 串是由零个或多个字符组成的有限序列.串中字符的个数称为串的长度. 串中任意个连续的字符组成的子序列称为该串的子串.包含子串的串相应地称为主串.通常称字符在序列中的序号为该字符在串中的位置.子串的首字符在主串中首次出现的位置定义为子串在主串中的位置. 串的逻辑结构和线性表十分相似,区别仅仅在于串的数据对象约束为字符集.然而两者的基本操作有很大差别.线性表中,基本以单个元素来进行操作:而串中多半以串的整体也

js二维数组定义和初始化的三种方法总结

方法一:直接定义并且初始化,这种遇到数量少的情况可以用 var _TheArray = [["0-1","0-2"],["1-1","1-2"],["2-1","2-2"]] 方法二:未知长度的二维数组 var tArray = new Array(); //先声明一维 for(var k=0;k<i;k++){ //一维长度为i,i为变量,可以根据实际情况改变 tArray[k]

javascript编程实现栈的方法详解【经典数据结构】

本文实例讲述了javascript编程实现栈的方法.分享给大家供大家参考,具体如下: 栈是限定仅在表尾进行插入或删除操作的线性表,栈是先进后出的.栈的表尾称为栈顶(top),而表头端称为栈底(bottom). 和线性表类似,栈也有两种存储表示方法,顺序栈和链栈. 这里讲一下顺序栈,设置指针top指示栈顶元素在顺序栈中的位置.通常的做法就是以top=0表示空栈.base为栈底指针,top为栈顶指针. 如果base为null,则表示栈结构不存在,如果top=base则表示空栈.每当插入一个新的元素,

js数组循环遍历数组内所有元素的方法

例,for(){}遍历数组 复制代码 代码如下: <script type="text/javascript"> <!--var arr = new Array(13.5,3,4,5,6);for(var i=0;i<arr.length;i++){ arr[i] = arr[i]/2.0;}alert(arr); //--> </script> 例,for in循环遍历数组 复制代码 代码如下: <html><body>

JavaScript数据结构之数组的表示方法示例

本文实例讲述了JavaScript数据结构之数组的表示方法.分享给大家供大家参考,具体如下: 数组类似于线性表.基本上每种语言都会讲数组作为固有类型.这里主要讲一下二维数组.我们可以把二维数组看成这样一个定长线性表:它的每个数据元素也是一个定长的线性表.数组一旦被定义,它的维数和维界就不再改变.因此,除了结构的初始化和销毁之外,数组只有存取元素和修改元素值的操作(这里注意和JavaScript中的array类型做出区分,这里说的是数据结构,而不是某一种单独语言的语法). 由于数组一般不作插入或者

JavaScript 中有关数组对象的方法(详解)

JS 处理数组多种方法 js 中的数据类型分为两大类:原始类型和对象类型. 原始类型包括:数值.字符串.布尔值.null.undefined 对象类型包括:对象即是属性的集合,当然这里又两个特殊的对象----函数(js中的一等对象).数组(键值的有序集合). 数组元素的添加 arrayObj.push([item1 [item2 [. . . [itemN ]]]]); 将一个或多个新元素添加到数组结尾,并返回数组新长度 arrayObj.unshift([item1 [item2 [. . .

JS实现字符串去重及数组去重的方法示例

本文实例讲述了JS实现字符串去重及数组去重的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net js数组.字符串去重</title> </head> <body> <script type="text/j

JavaScript实现计算多边形质心的方法示例

本文实例讲述了JavaScript实现计算多边形质心的方法.分享给大家供大家参考,具体如下: 最近要基于百度地图显示多边形的标注,所以就研究了下计算Polygon的质心,代码如下: function Area(p0,p1,p2) { var area = 0.0 ; area = p0.lng * p1.lat + p1.lng * p2.lat + p2.lng * p0.lat - p1.lng * p0.lat - p2.lng * p1.lat - p0.lng * p2.lat; re

JavaScript对JSON数组简单排序操作示例

本文实例讲述了JavaScript对JSON数组简单排序操作.分享给大家供大家参考,具体如下: 我们经常回使用到数据格式 var arr=[{num:1},{num:3},{num:2}] 如何根据数组里面的JSON数据的某个key进行排序 javascript有一个sort()方法,直接通过 arr.sort()进行排序,默认只对数组的值进行排序,然而以上的数组的值却是个JSON格式的. 我们在看看sort方法的定义: 定义和用法 sort() 方法用于对数组的元素进行排序. 语法 array

JavaScript格式化json和xml的方法示例

本文实例讲述了JavaScript格式化json和xml的方法.分享给大家供大家参考,具体如下: 格式化json实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>原生js格式化json的方法</title> </head> <body> <!--格式化后的json写入的位

javascript数据结构之多叉树经典操作示例【创建、添加、遍历、移除等】

本文实例讲述了javascript数据结构之多叉树经典操作.分享给大家供大家参考,具体如下: 多叉树可以实现复杂的数据结构的存储,通过遍历方法可以方便高效的查找数据,提高查找的效率,同时方便管理节点数据.javascript的DOM其实就是以多叉树的形式存储的.下面用javascript来实现多叉树的数据结构 1.创造一个节点 数据是以节点的形式存储的: class Node { constructor(data) { this.data = data; this.parent = null;

JavaScript插入排序算法原理与实现方法示例

本文实例讲述了JavaScript插入排序算法原理与实现方法.分享给大家供大家参考,具体如下: 一.插入排序简介: 想象我们斗地主,摸排阶段,手里的牌都按照从小到大排序.如果每摸一张牌,我们就把他插入合适的位置,使得它比后面位置的牌小,比前面位置的牌大或者相等. 类似这样的一种排序方法就是插入排序: 在一个数组a中,我们要实现升序排序,假设我们前面已经对a[0]到a[k]排好序,现在需要将a[k+1]的值放入合适的位置. (为简便,此处不讨论k的取值范围,只是用它代表数组的某个位置) 1.首先,

JS笛卡尔积算法与多重数组笛卡尔积实现方法示例

本文实例讲述了JS笛卡尔积算法与多重数组笛卡尔积实现方法.分享给大家供大家参考,具体如下: js 笛卡尔积算法的实现代码,据对象或者数组生成笛卡尔积,并介绍了一个javascript多重数组笛卡尔积的例子,以及java实现笛卡尔积的算法与实例代码. 一.javascript笛卡尔积算法代码 例子,根据对象或者数组生成笛卡尔积. //笛卡儿积组合 function descartes(list) { //parent上一级索引;count指针计数 var point = {}; var resul