小议Function.apply()之二------利用Apply的参数数组化来提高 JavaScript程序性能


Posted in Javascript onNovember 30, 2006

我们再来聊聊Function.apply() 在提升程序性能方面的技巧。

我们先从 Math.max() 函数说起,  Math.max后面可以接任意个参数,最后返回所有参数中的最大值。

比如 
alert(Math.max(5,8))   //8
alert(Math.max(5,7,9,3,1,6))   //9

但是在很多情况下,我们需要找出数组中最大的元素。
var arr=[5,7,9,1]
alert(Math.max(arr))    //   这样却是不行的。一定要这样写

function getMax(arr){
    var arrLen=arr.length;
    for(var i=0,ret=arr[0];i<arrLen;i++){
        ret=Math.max(ret,arr[i]);       
    }
    return ret;
}
这样写麻烦而且低效。如果用 apply呢,看代码:
function getMax2(arr){
    return Math.max.apply(null,arr)
}
两段代码达到了同样的目的,但是getMax2却优雅,高效,简洁得多。

看性能测试:
getMax性能测试

<script>
var myArr=new Array()

function fillRnd(arrLen){  //填入 arrLen个1-10的随机数字到数组
    for(var i=0,arr=[];i<arrLen;i++){
        arr[i]=Math.ceil(Math.random()*10)
    }
    return arr
}

function getMax(arr){
    var arrLen=arr.length;
    for(var i=0,ret=arr[0];i<arrLen;i++){
        ret=Math.max(ret,arr[i]);       
    }
    return ret;
}

function getMax2(arr){
    return Math.max.apply(null,arr)
}

myArr=fillRnd(20*10000)  //生成20万个随机数填到数组

var t1=new Date()
var max1=getMax(myArr)
var t2=new Date()
var max2=getMax2(myArr)
var t3=new Date()

if (max1!==max2) alert("error")
alert([t3-t2,t2-t1])   //在我机器上 96,464 .不同的机器,结果可能有差异

</script>

通过20万个数据的比较, getMax2 时间为 96ms 而 getmax时间为464。 两者相差5倍

 再比如数组的push方法。
var arr1=[1,3,4];
var arr2=[3,4,5];
如果我们要把 arr2展开,然后一个一个追加到 arr1中去,最后让  arr1=[1,3,4,3,4,5]
arr1.push(arr2)  显然是不行的。 因为这样做会得到  [1,3,4, [3,4,5] ]

我们只能用一个循环去一个一个的push   (当然也可以用 arr1.concat(arr2) 但是concat方法并不改变 arr1本身)
var arrLen=arr2.length
for(var i=0;i<arrLen;i++){
    arr1.push(arr2[i])
}

自从有了 Apply    ,事情就变得如此简单

Array.prototype.push.apply(arr1,arr2)

Javascript 相关文章推荐
javascript学习笔记(五)正则表达式
Apr 08 Javascript
js DOM的学习笔记
Dec 22 Javascript
js鼠标滑过弹出层的定位IE6bug解决办法
Dec 26 Javascript
javascript简单实现图片预加载
Dec 03 Javascript
浅谈Javascript中的12种DOM节点类型
Aug 19 Javascript
AngularJS动态生成div的ID源码解析
Aug 29 Javascript
AngularJS 表达式详解及实例代码
Sep 14 Javascript
jQuery向父辈遍历的简单方法
Sep 18 Javascript
js判断价格,必须为数字且不能为负数的实现方法
Oct 07 Javascript
jQuery使用ajax_动力节点Java学院整理
Jul 05 jQuery
基于vue-cli 打包时抽离项目相关配置文件详解
Mar 07 Javascript
解决vue-pdf查看pdf文件及打印乱码的问题
Nov 04 Javascript
小议Function.apply() 之一------(函数的劫持与对象的复制)
Nov 30 #Javascript
addRule在firefox下的兼容写法
Nov 30 #Javascript
跟随鼠标旋转的文字
Nov 30 #Javascript
推荐:极酷右键菜单
Nov 29 #Javascript
双击滚屏-常用推荐
Nov 29 #Javascript
js获取单选按钮的数据
Nov 27 #Javascript
准确获得页面、窗口高度及宽度的JS
Nov 26 #Javascript
You might like
环境会对咖啡种植有什么影响
2021/03/03 咖啡文化
PHP生成json和xml类型接口数据格式
2015/05/17 PHP
浅析ThinkPHP缓存之快速缓存(F方法)和动态缓存(S方法)(日常整理)
2015/10/26 PHP
win7安装php框架Yii的方法
2016/01/25 PHP
Linux系统中为php添加pcntl扩展
2016/08/28 PHP
PHP解压ZIP文件到指定文件夹的方法
2016/11/17 PHP
浅析PHP7的多进程及实例源码
2019/04/14 PHP
你必须知道的Javascript知识点之&quot;字面量和对应类型&quot;说明介绍
2013/04/23 Javascript
JS实现文件动态顺序载入的方法
2015/03/07 Javascript
javascript为按钮注册回车事件(设置默认按钮)的方法
2015/05/09 Javascript
JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法
2015/07/01 Javascript
jquery不常用方法汇总
2015/07/26 Javascript
jQuery基于ajax实现星星评论代码
2015/08/07 Javascript
浅谈JavaScript作用域和闭包
2017/09/18 Javascript
浅谈JS的原型和继承
2019/05/08 Javascript
node实现mock-plugin中间件的方法
2019/12/25 Javascript
利用JS判断元素是否为数组的方法示例
2021/01/08 Javascript
[42:39]老党炸弹人试玩视频
2014/09/03 DOTA
python实现dnspod自动更新dns解析的方法
2014/02/14 Python
python实现的简单猜数字游戏
2015/04/04 Python
Python3如何解决字符编码问题详解
2017/04/23 Python
详谈Python3 操作系统与路径 模块(os / os.path / pathlib)
2018/04/26 Python
使用python将大量数据导出到Excel中的小技巧分享
2018/06/14 Python
python的pip安装以及使用教程
2018/09/18 Python
python3的url编码和解码,自定义gbk、utf-8的例子
2019/08/22 Python
python实现机器人卡牌
2019/10/06 Python
selenium 多窗口切换的实现(windows)
2020/01/18 Python
Python日期格式和字符串格式相互转换的方法
2020/02/18 Python
能否解释一下XSS cookie盗窃是什么意思
2012/06/02 面试题
运动会通讯稿500字
2014/02/20 职场文书
中学生运动会新闻稿
2014/09/24 职场文书
2014年应急管理工作总结
2014/11/26 职场文书
会计主管岗位职责
2015/04/02 职场文书
Java Dubbo框架知识点梳理
2021/06/26 Java/Android
WIN10使用IIS部署ftp服务器详细教程
2022/08/05 Servers
纯CSS打字动画的实现示例
2022/08/05 HTML / CSS