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

  我们再来聊聊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)