关于for循环中是否需要缓存length值的个人总结

在JS性能优化中,有一个常见的小优化,即

// 不缓存
for (var i = 0; i < arr.length; i++) {
  ...
}

// 缓存
var len = arr.length;
for (var i = 0; i < len; i++) {
  ...
}
第二种方式是大多数的程序猿推荐的一种写法,据说是有利于性能提升,本人没有检测过,但是找到一篇相关文章:http://www.crimx.com/2015/04/21/should-array-length-be-cached-or-not/大家可以参考该作者的一些意见。另外确实不是一个优雅的写法,这点我是同意的。

那么,我们就应该摒弃这种写法吗?不是的,还有另外一种情况,必须使用这种写法。

请看栗子:var divs = document.getElementsByTagName("div"), i, div ;for( i=0; i<divs.length; i++ ){  div = document.createElement("div");    document.body.appendChild("div");}以上代码会导致无限循环:第一行代码会取得所有的div元素的nodelist,由于nodelist是动态的,因此只要有新的div添加到页面中,下一次的for循环就会再对divs.length求值,因此i和divs.length每次都会同时递增,结果他们的值永远不会相等,就创建了一个死循环。

所以,如果想要迭代一个nodelist最好使用length属性初始化第二个变量,然后将迭代器与该变量进行比较,修改后的代码如下:var divs = document.getElementsByTagName("div"), i, div ,len ;for(i=0;len=divs.length;i<len;i++){  div = document.createElement("div");  document.body.appendChild("div");}这个例子中初始化了len,由于len中保存着divs.length在循环开始时的一个快照,因此会避免上一个例子中出现的无限循环问题,因此当需要对nodelist进行循环迭代的时候,使用这种方法更为保险。

总结:1.将length的值进行缓存,到底是否有利于性能优化,是一个需要根据具体情况进行判断的事情,总体来讲,减少对DOM的访问还是有好处的;2.当需要操作nodelist的时候,建议将length的值进行缓存,可以避免出现死循环。



时间: 2024-10-08 19:44:00

关于for循环中是否需要缓存length值的个人总结的相关文章

在循环中如何取input的值和增加点击事件

{volist name="dianpu" id="dianpu"} <input style="border: none;" readonly name="guanzhu" data_value="{$dianpu.is_guanzhu}" data_zhi="{$dianpu.shopId}" value="{$dianpu.shopId}{$dianpu.is_gu

《逐梦旅程 WINDOWS游戏编程之从零开始》笔记6——Direct3D中的顶点缓存和索引缓存

第12章 Direct3D绘制基础 1. 顶点缓存 计算机所描绘的3D图形是通过多边形网格来构成的,网网格勾勒出轮廓,然后在网格轮廓的表面上贴上相应的图片,这样就构成了一个3D模型.三角形网格是构建物体模型的基本单元,而一个三角形有3个顶点,为了能够使用大量三角形组成三角形网格来描述物体,需要首先定义号三角形的顶点(Vertex),3个顶点确定一个三角形,顶点除了定义每个顶点的坐标位置外,还还含有颜色等其他属性. 在Direct3D中,顶点的具体表现形式是顶点缓存,顶点缓存保存了顶点数据的内存空

循环中读取数据库、嵌套循环引起的性能问题

背景说明 K/3 Cloud的代码开发规范,严格禁止在循环中到数据库读取数据,这会引发严重的性能问题: 需在循环外,一次性取回需要的数据. 但对于提前取回的数据,如果没有预先处理,常常需要嵌套一个循环到集合中取数,这也是非常严重的性能问题. 本帖将通过一个案例,编写三套实现方法,演示循环取数,典型的错误方案与推荐方案. 案例说明 需求: 生成销售出库单时,自动检查库存,从有存货的仓库出库. 实现方案: 编写单据转换插件,物料.数量携带完毕后,到数据库取有存货的仓库,填写到仓库字段中: 如果某一个

使用JUC并发工具包的Lock和Condition,实现生产者和消费者问题中的有界缓存

JDK5.0之前,用java实现生产者和消费者的唯一方式就是使用synchronized内置锁和wait/notify条件通知机制.JDK5.0之后提供了显示锁Lock和条件队列Condition,与内置锁和内置条件队列相对应,但是显示的锁和条件队列,功能更强大,更灵活.此外JDK5.0之后还提供了大量很有用的并发工具类,如BlockingQueue等,基于这些数据结构,能够方便.快速.高效的构建自己应用需要的效果.这里我们简单使用下显示锁和条件队列,来模拟有界缓存的实现,功能类似于JDK内置的

关于在for循环中绑定事件打印变量i是最后一次。

其实函数引用的外部变量都是最后一次的值. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> #box{ width:100px; height:100px; background-color:pink; } </style> <

浅谈Android中的异步加载之ListView中图片的缓存及优化三

     隔了很久没写博客,现在必须快速脉动回来.今天我还是接着上一个多线程中的异步加载系列中的最后一个使用异步加载实现ListView中的图片缓存及其优化.具体来说这次是一个综合Demo.但是个人觉得里面还算有点价值的就是里面的图片的缓存的实现.因为老实说它确实能在实际的项目中得到很好的应用.主要学习来源于慕课网中的异步加载学习,来自徐宜生大神的灵感.本次也就是对大神所讲知识的一个总结及一些个人的感受吧. 这次是一个综合的Demo,主要里面涉及到的知识主要有:网络编程.异步加载.JSON解析.

关于Android中的三级缓存

三级缓存的提出就是为了提升用户体验.当我们第一次打开应用获取图片时,先到网络去下载图片,然后依次存入内存缓存,磁盘缓存,当我们再一次需要用到刚才下载的这张图片时,就不需要再重复的到网络上去下载,直接可以从内存缓存和磁盘缓存中找,由于内存缓存速度较快,我们优先到内存缓存中寻找该图片,如果找到则运用,如果没有找到(内存缓存大小有限),那么我们再到磁盘缓存中去找.只要我们合理的去协调这三层缓存运用,便可以提升应用性能.三级缓存指的是:内存缓存.本地缓存.网络缓存.其各自的特点是内存缓存速度快, 优先读

(转)深入理解JavaScript的闭包特性 如何给循环中的对象添加事件

深入理解JavaScript的闭包特性如何给循环中的对象添加事件 初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript的闭包特性. 有个网友问了个问题,如下的html,为什么点击所有的段落p输出都是5,而不是alert出对应的0,1,2,3,4. 1.  <!DOCTYPE HTML> 2.  <html> 3.  <head&g

循环中创建函数的问题

//糟糕的例子 var add_handlers = function(nodes){ var i; for(i = 0; i < nodes.length; i++){ nodes[i].onclick = function (e){ alert(i); }; } }; //结束糟糕的例子 //改进的例子 var add_handlers = function(nodes){ var helper = function(i){ return function(e){ alert(i); } }