随着js的深入和实际项目对性能的要求,算法的简单实现已经不能满足需要,在不同的应用场景下,时间复杂度很重要。

首先是创建数组与性能处理函数:

// 保证时间差的明显程度,创建不同量级的数组,size为数组的量级
function createArr (size) {
var len = size/100
var create = []
for (var i=0; i<100; i++ ) {
for(var j=0; j<len; j++) {
create.push(j)
}
} return create
} // 以回调的方式
function checkTime (fn) {
var date1 = new Date().getTime()
var create = fn()
var date2 = new Date().getTime()
return {
create: create,
time: date2 - date1
}
}

下面上不同去重函数的思路:

1. 常规思路,双层for循环,逐个去重

function singelArray (array) {
var temp =[];
for(var i = 0; i<array.length; i++) {
for(var j = i+1; j<array.length; j++) {
if (array[i] === array[j]) ++i
}
temp.push(array[i])
}
return temp;
}

2.为减少for循环层级,先为数组排序

function singelArray2 (array) {
var temp = [array[0]] array.sort(function(a,b){
return a - b;
}) for(var i=0; i<array.length; i++) {
if(array[i] !== temp[temp.length - 1]) {
temp.push(array[i])
}
} return temp
}

3.利用对象属性唯一的特性

function singelArray3 (array) {
var obj = {};
var temp = []
for (var i=0; i<array.length; i++) {
if( !obj[array[i]] ) {
temp.push(array[i]);
obj[array[i]] = 1;
} }
return temp
}

4. ES6 新增数据结构

function singelArray4 (array) {
return new Array(...(new Set(array)))
}

*******性能测试

为避免误差,不同量级的数组操作四次

// 百万量级
var lgArr = createArr(1000000)
var res = checkTime(function(){return singelArray(lgArr)});
var res2 = checkTime(function(){return singelArray2(lgArr)});
var res3 = checkTime(function(){return singelArray3(lgArr)});
var res4 = checkTime(function(){return singelArray4(lgArr)});
console.log(res) // 常规思路 time: 119 115 116 115
console.log(res2) // 先排序 time: 769 774 768 775
console.log(res3) // 对象属性唯一 time: 14 15 14 14
console.log(res4) // es6 Set time: 25 24 26 26
// 千万量级
var lgArr = createArr(10000000)
var res = checkTime(function(){return singelArray(lgArr)});
var res2 = checkTime(function(){return singelArray2(lgArr)});
var res3 = checkTime(function(){return singelArray3(lgArr)});
var res4 = checkTime(function(){return singelArray4(lgArr)});
console.log(res) // 常规思路 time: 10542 10549 10550 10540
console.log(res2) // 先排序 time: 8130 8146 8072 8031
console.log(res3) // 对象属性唯一 time: 119 118 118 118
console.log(res4) // es6 Set time: 253 247 243 239

五千万量级和一亿量级尝试了下,时间着实长了点...  作者电脑可能垃圾了,有兴趣的可以自己测一下。

总体来看在考虑兼容性的情况下,推荐使用第三种方法,可用ES6时,建议使用第四种方法。或者统一使用ES6方法,最后再用babel转一下,不过小编没试过,不好妄下评论。

js数组去重与性能分析(时间复杂度很重要)的更多相关文章

  1. JS数组去重的几种常见方法

    JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...

  2. js数组去重五种方法

    今天来聊一聊JS数组去重的一些方法,包括一些网上看到的和自己总结的,总共5种方法(ES5). 第一种:遍历数组法 这种方法最简单最直观,也最容易理解,代码如下: var arr = [2, 8, 5, ...

  3. js数组去重的方法(转)

    JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...

  4. JS数组去重的6种算法实现

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

  5. js数组去重解决方案

    js数组去重是前端面试中经常被问的题目,考察了面试者对js的掌握,解决问题的思路,以及是否具有专研精神.曾经一位前端界大神告诉我,解决问题的方式有很多种,解决问题时多问问自己还有没有其他的方法,探求最 ...

  6. js数组去重,id相同对某值相加合并

    js数组去重,id相同对某值相加合并 案例1: 假设需要处理的数组结构. let arr =[ {id:'1', value:10}, {id:'1', value:20}, {id:'2', val ...

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

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

  8. JS 数组去重(数组元素是对象的情况)

    js数组去重有经典的 几种方法 但当数组元素是对象时,就不能简单地比较了,需要以某种方式遍历各值再判断是否已出现. 因为: 1.如果是哈希判断法,对象作哈希表的下标,就会自动转换成字符型类型,从而导致 ...

  9. php数组去重实例及分析

    php数组去重实例及分析.  一维数组的重复项: 使用array_unique函数即可,使用实例 <?php    $aa=array("apple","banan ...

随机推荐

  1. IIS并发连接数及性能优化

    如果要查看IIS连接数,最简单方便的方法是通过“网站统计”来查看,“网站统计”的当前在线人数可以认为是当前IIS连接数.然而,“网站统计”的当前在线人数统计时间较长,一般为10分钟或15分钟,再加上统 ...

  2. IIS并发连接数和数据库连接池

    一.数据库连接池 1.报错: 超时时间已到.超时时间已到,但是尚未从池中获取连接.出现这种情况可能是因为所有池连接均在使用,并且达到了最大池大小. 2.问题分析: 问题的原因是与数据库的连接没有显示关 ...

  3. node.js原生后台进阶(二)

    上一章讲到怎么样用原生node.js来获取GET.POST(urlencoded,formData)的参数,这一次我们更进一步,讲一下以下的点: 1.压缩(zlib) 2.流(stream) 3.路由 ...

  4. Redis记录-JAVA连接Redis

    在Java程序中使用Redis之前,需要确保在机器上安装了Redis的Java驱动程序和Java环境.可以先在将Java电脑上并配置好环境. 安装 现在,让我们看看如何设置Redis Java驱动程序 ...

  5. 什么是HTTP协议

    什么是Http协议Http协议即超文本传送协议 (HTTP-Hypertext transfer protocol) .它定义了浏览器(即万维网客户进程)怎样向万维网服务器请求万维网文档,以及服务器怎 ...

  6. php拾遗: 类型约束

    突然间什么都不想干,感觉就像来大姨夫一样..但是又不能断了每个工作日都写博客的习惯..所以今天水一下吧. PHP用了快2年了,但是这东西竟然第一次看到,突然间,觉得自己有掉回战五渣的行列了.翻开官方文 ...

  7. 第8月第21天 django lbforum项目记录

    1. django-admin.py startproject lbforum01 ls cd lbforum01/ ls python manage.py startapp forum sudo p ...

  8. CSS text系列

    text-shadow 语法规则: h-shadow(必需,水平阴影的位置,可负): v-shadow(必需,垂直阴影的位置,可负): blur(可选,模糊距离): color(可选,阴影的颜色). ...

  9. python之celery使用详解(二)

    前言 前面我们了解了celery的基本使用后,现在对其常用的对象和方法进行分析. Celery对象 核心的对象就是Celery了,初始化方法: class Celery(object): def __ ...

  10. arm GIC介绍之一【转】

    转自:https://blog.csdn.net/sunsissy/article/details/73791470 GIC是ARM架构中及其重要的部分,本文只在公开ARM对应资料基础上,以MTK开发 ...