面试前端必须准备的一个问题:怎样去掉Javascript的Array的重复项, 这个问题看起来简单,但是其实暗藏杀机。 考的不仅仅是实现这个功能,更能看出你对计算机程序执行的深入理解。

我总共总结4种算法来实现这个目的:

  1. Array.prototype.unique1 = function()
    {
    var n = []; //一个新的临时数组
    for(var i = 0; i < this.length; i++) //遍历当前数组
    {
    //如果当前数组的第i已经保存进了临时数组,那么跳过,
    //否则把当前项push到临时数组里面
    if (n.indexOf(this[i]) == -1) n.push(this[i]);
    }
    return n;
    }
  2. Array.prototype.unique2 = function()
    {
    var n = {},r=[]; //n为hash表,r为临时数组
    for(var i = 0; i < this.length; i++) //遍历当前数组
    {
    if (!n[this[i]]) //如果hash表中没有当前项
    {
    n[this[i]] = true; //存入hash表
    r.push(this[i]); //把当前数组的当前项push到临时数组里面
    }
    }
    return r;
    }
  3. Array.prototype.unique3 = function()
    {
    var n = [this[0]]; //结果数组
    for(var i = 1; i < this.length; i++) //从第二项开始遍历
    {
    //如果当前数组的第i项在当前数组中第一次出现的位置不是i,
    //那么表示第i项是重复的,忽略掉。否则存入结果数组
    if (this.indexOf(this[i]) == i) n.push(this[i]);
    }
    return n;
    }
Array.prototype.unique4 = function()
{
this.sort();
var re=[this[0]];
for(var i = 1; i < this.length; i++)
{
if( this[i] !== re[re.length-1])
{
re.push(this[i]);
}
}
return re;
}

其中第1种和第3种方法都用到了数组的indexOf方法。此方法的目的是寻找存入参数在数组中第一次出现的位置。很显然,js引擎在实现这个方法的时候会遍历数组直到找到目标为止。所以此函数会浪费掉很多时间。 而第2中方法用的是hash表。把已经出现过的通过下标的形式存入一个object内。下标的引用要比用indexOf搜索数组快的多。

为了判断这三种方法的效率如何,我做了一个测试程序,生成一个10000长度的随机数组成的数组,然后分别用几个方法来测试执行时间。 结果表明第二种方法远远快于其他两种方法。 但是内存占用方面应该第二种方法比较多,因为多了一个hash表。这就是所谓的空间换时间。  就是这个测试页面,你也可以去看看。

第4种方法的思路是先把数组排序,然后比较相邻的两个值。 排序的时候用的JS原生的sort方法,JS引擎内部应该是用的快速排序吧。 最终测试的结果是此方法运行时间平均是第二种方法的三倍左右,不过比第一种和第三种方法快了不少。

博客参考原文http://blog.csdn.net/chengxuyuan20100425/article/details/8497277

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

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

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

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

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

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

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

  4. js数组去重的三种常用方法总结

    第一种是比较常规的方法 思路: 1.构建一个新的数组存放结果 2.for循环中每次从原数组中取出一个元素,用这个元素循环与结果数组对比 3.若结果数组中没有该元素,则存到结果数组中   Array.p ...

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

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

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

    <script type="text/javascript"> /*// 第一种冒泡法删除 var arr=[1,2,2,78,3,456,456]; for(var ...

  7. js 数组去重 的5种方法

    一万数组,4个重复项,先贴上成绩. 1.3毫秒 2.115毫秒 3.71毫秒 4.6毫秒 1.哈希表 2.JQuery (最快的方法是用JQuery 这句话是截图带的... 实际上Jq是最慢的) 3. ...

  8. JS — 数组去重(4种方法)

    第一种:双重循环 var strCode='zxcvbnmasdfghjklopiuytrewqAWEDRFTGYHUJIK'; var str=''; for(var i=0;i<4;i++) ...

  9. js 数组去重的三种方法(unique)

    方法一: Array.prototype.unique=function(){ var arr=[];//新建一个临时数组 for(var i=0;i<this.length;i++){//遍历 ...

随机推荐

  1. 理解钩子Hook以及在Thinkphp下利用钩子使用行为扩展

    什么是钩子函数 个人理解:钩子就像一个”陷阱”.”监听器”,当A发送一个消息到B时,当消息还未到达目的地B时,被钩子拦截调出一部分代码做处理,这部分代码也叫钩子函数或者回调函数 参考网上说法 譬如我们 ...

  2. gcc 版本降级

    由于刚刚装了ubuntu 16.04,该版本gcc版本为5.4.0太高,很多软件不支持,所以要降版本,可以直接看(三)解决 一.gcc源代码网站 ftp://mirrors.kernel.org/gn ...

  3. Delphi中对BCD码的直接支持 (转)

    最近在Delphi下写软件,需要将数据转换为BCD码和将BCD码转换为其它数据类型,从网上搜索了一下,没有发现好的函数,于是就想自定义函数来完成BCD与其它格式的数据转换功能.但最终没有动手写,先查查 ...

  4. NHibernate 基本配置 (第一篇)

    使用NHibernate最重要的一步就是配置,如果连NHibernate都还没有跑的起来,谈何学习.今天就来详解一下NHibernate的配置. 一.NHibernate基本配置 NHibernate ...

  5. 点击页面其它地方隐藏div所想到的jQuery的delegate

    在网页开发的过程中经常遇到的一个需求就是点击一div内部做某些操作,而点击页面其它地方隐藏该div.比如很多导航菜单,当菜单展开的时候,就会要求点击页面其它非菜单地方,隐藏该菜单. 先从最简单的开始, ...

  6. Eclipse上的项目分享到GitHub

    1. 右击项目:team --> Share Project 2. 在弹出的选择框中选择 Git ,点击Next 3. Configure Git Repository 按照下图选择,点击Fin ...

  7. [转载]CRect::DeflateRect

    1基本内容 void DeflateRect(int x,int y); void DeflateRect(SIZE size); void DeflateRect(LPCRECT lpRect); ...

  8. 关于android端的json传输

    比较通用的传输方法 import java.util.ArrayList; import java.util.List; import org.apache.http.HttpEntity; impo ...

  9. SQL Server 数据库新建用户

    1.在[安全性]中的[登录名]右键创建登陆用户 2. 输入相关信息 3. 然后去相应的数据库下[安全性]中右键添加用户 4.选择刚刚创建的用户名 5. 选择[默认架构]为 owner 6. 对[拥有的 ...

  10. Spring的quartz定时器同一时刻重复执行二次的问题解决

    最近用Spring的quartz定时器的时候,发现到时间后,任务总是重复执行两次,在tomcat或jboss下都如此. 打印出他们的hashcode,发现是不一样的,也就是说,在web容器启动的时候, ...