JavaScript模拟map的实现及其性能分析
来源:互联网 发布:网络解锁 编辑:程序博客网 时间:2024/06/06 07:41
JavaScript模拟map的实现极其性能分析
由于JavaScript原生的没有提供Map,而Map又是非常常用的工具类,在这里我为大家介绍几种JavaScript下的Map实现方式。
Map我们需要实现的核心其实就是他的put()和get()方法,至于其他的size()等方法可后续添加。
不了解JavaScript的同学可能首先想到的实现的方式可能会是用一个Array数组来保存数据然后get的时候遍历一遍去匹配Key,因为这是几乎所有语言都通用的方法,简直是跨平台,哈哈。代码和get()的性能我就不列了,相信大家也能知道去遍历一遍数组在数组越来越大的时候性能是直线下降的。遍历100W大小的从后面的例子中大家也可以看一下需要的时间。
下面为大家介绍两种比较合适的方法,
1.使用Object对象,将key作为属性名称保存,get的时候就直接使用属性名称获取值。代码如下。
var Map = function(){ var cache = {}; this.get = function(key){ return cache[key] } this.put = function(key,val){ cache[key] = val; }};var m = new Map();m.put('key1','val1');m.put('key2','val2');console.log(m.get('key1'));//val1
2.其实和第一种几乎一样,只不过存储的对象从Object改为Array。代码如下。
var Map = function(){ var cache = []; this.get = function(key){ return cache[key] } this.put = function(key,val){ cache[key] = val; }};var m = new Map();m.put('key1','val1');m.put('key2','val2');console.log(m.get('key2'));//val2
两种方式实现都很方便,第二种看起来更方便,因为看起来似乎更适合扩展,比如说添加size()方法的时候直接返回数组的大小就可以了。
下面我们对其性能进行一下简单的对比,测试代码:
function getCurrentTime() {return new Date().getTime();}function test(size,Obj){var d1 = getCurrentTime();var m = new Obj();for (var i = 0; i < size; i++) {m.put('key' + i, 'val' + i);}var d2 = getCurrentTime();var data = m.get('key100');var d3 = getCurrentTime();return {t1:d2-d1,//初始化所需时间t2:d3-d2//get数据所需时间}}function doTest(){var dataSize = 1000000;//Map中数据数量var testTimes = 10;//测试次数var arrayMapRs = {totalInitTime:0,totalGetTime:0};var objectMapRs = {totalInitTime:0,totalGetTime:0};for(var i=0;i<testTimes;i++){var ta = test(dataSize,ArrayMap);var to = test(dataSize,ObjectMap);arrayMapRs.totalInitTime = arrayMapRs.totalInitTime + ta.t1;arrayMapRs.totalGetTime = arrayMapRs.totalGetTime + ta.t2;objectMapRs.totalInitTime = objectMapRs.totalInitTime + to.t1;objectMapRs.totalGetTime = objectMapRs.totalGetTime + to.t2;}console.info('ArrayMap:');console.info('初始化Map平均时间:'+arrayMapRs.totalInitTime/testTimes+'ms');console.info('get平均时间:'+arrayMapRs.totalGetTime/testTimes+'ms');console.info('ObjectMap:');console.info('初始化Map平均时间:'+objectMapRs.totalInitTime/testTimes+'ms');console.info('get平均时间:'+objectMapRs.totalGetTime/testTimes+'ms');}
测试结果:
数据量10000:
数据量100000:
数据量1000000:
结论:
千万数据我的浏览器就崩溃了- -,此数据为chrome下数据,看了一下IE10和FF下表现没有差别,上面的结果key采用的是字符串形式,我曾经也猜测过int型对Array更有利,但是结果表现也是几乎没有差别,两者的get速度都非常的快,几乎可以忽略不计,数据量的改变似乎只是增加了循环初始化数据的时间。
0 0
- JavaScript模拟map的实现及其性能分析
- JavaScript模拟Map的实现
- JavaScript各种排序算法的实现及其速度性能分析
- javascript模拟实现Map
- 单例的五种实现方式,及其性能分析。
- 单例的五种实现方式,及其性能分析。
- 单例的五种实现方式,及其性能分析
- JavaScript实现的Map
- JavaScript Map的实现
- Javascript的map实现
- map的简单模拟实现
- Map及其子类源码简单分析以及性能比较
- 类模拟的性能分析
- JavaScript中模拟实现Java的集合类Map的常用方
- javascript模拟map
- JavaScript实现简单的Map
- javascript实现简单的Map
- javascript中模拟实现java语言中的map
- 使用go reflect实现一套简易的rpc框架
- 级联二步图关系挖掘关键词推荐系统及实现代码
- PyQt精彩实例地址
- 向上推动门效果
- shell界面下安装和卸载Android应用程序(apk包)
- JavaScript模拟map的实现及其性能分析
- Android 自定义视图 顶部导航
- HttpURLConnection 上传大文件 内存溢出 out of memery
- java application应用程序 使用JDBC和proxool两种方式连接数据库 的测试程序代码
- jquery click 传递参数
- android camera(一):camera模组CMM介绍 .
- HEVC ZOrder and RasterOrder
- 仔细推敲,这些说法都是无稽之谈
- C#多线程协同完成一个任务