利用console.time优化js代码

前言

也许你经常会想知道如何优化自己的代码，除了设计模式、代码简洁、易维护之外，我们还需要考虑的一点也非常重要，尤其是检测一些逻辑的复杂性上，那就是代码的实际执行时间。

console.time(timerName)

作为常识，我们首先要知道console.time() 以及timeEnd()已经为我们提供了api，可以方便的检测代码段的执行时间，每一个计时器必须拥有唯一的名字，页面中最多能同时运行10,000个计时器,最终会返回一个代码段执行的计时：timerName：xxxms。

在这个之前我们可能是通过代码开始和结束位置加入new Date()来查看时间差对比代码执行效率。

mdn参考文档：console.time

for循环

众所周知，for循环是非常低效的方式，但有些时候可能没有更好的方法找到某条件的元素，但一定要注意我们在找到匹配某条件的元素后要跳出循环，否则就会进行无意义的继续循环，降低代码的执行效率。

代码举例

function test1(){
  console.time(1)
  for(var i = 0 ; i<1000000 ;i++){
    if(i==99) {
      var temp=1
      continue 
    }
  }
  console.timeEnd(1)
}

function test2(){
  console.time(2)
  for(var i = 0 ; i<1000000 ;i++){
    if(i==99) {
      var temp=1
      break 
    }
  }
  console.timeEnd(2)
}
test1()//268.429931640625ms
test2()//0.09326171875ms

codepen实例

console.time案例

总结

通过以上时间的直接证明，我们可以看出某些必要的逻辑优化以及代码优化是非常必要的（比如逻辑完成时及时跳出当前逻辑尤其循环逻辑），对于代码执行效率上总结出来的一些经验可是非常宝贵的编程思想or技巧。