在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的值进行缓存,可以避免出现死循环。


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

  1. C#Random函数在循环中每次获取一样的值

    首先需要了解一点Random函数的随机生成是和当前时间有关系,如果在短时间生成随机数,就会导致随机数生成出来是相同的. 不过我们可以在每次随机时指定一个Seed种子值,这样在循环里就可以每次获取不一样 ...

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

    {volist name="dianpu" id="dianpu"} <input style="border: none;" rea ...

  3. 关于for循环中的闭包问题

    还是昨天的那个简单的小项目,已经花了一天的时间了 - - .从&&的用法,到CSStext,到今天马上要谈的闭包(closure),通过一个小东西,真真发现了自己的各方面不足.昨天发完 ...

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

    第12章 Direct3D绘制基础 1. 顶点缓存 计算机所描绘的3D图形是通过多边形网格来构成的,网网格勾勒出轮廓,然后在网格轮廓的表面上贴上相应的图片,这样就构成了一个3D模型.三角形网格是构建物 ...

  5. 关于Android中的三级缓存

    三级缓存的提出就是为了提升用户体验.当我们第一次打开应用获取图片时,先到网络去下载图片,然后依次存入内存缓存,磁盘缓存,当我们再一次需要用到刚才下载的这张图片时,就不需要再重复的到网络上去下载,直接可 ...

  6. js for 循环中的 变量问题。

    今日处理项目中的一个循环,本来就是一个小小的for循环,后来发现该段程序出现了问题,仔细检查代码没有发现其中的错误.无奈只好叫来了老大帮忙.通过在模版中断点调试(该方式只能自己写debugger断点) ...

  7. JQuery在循环中绑定事件的问题详解

    JQuery在循环中绑定事件的问题详解 有个页面上需要N个DOM,每个DOM里面的元素ID都要以数字结尾,比如说 ? 1 2 3 <input type="text" nam ...

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

    其实函数引用的外部变量都是最后一次的值. <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  9. 关于ListView中convertView的缓存个数的探究

    在面试的时候经常会被问到一个有关ListView的问题:一个ListView的高度最多可以显示5个item,但是却有20条数据要显示,问最多会有多少个convertView会被复用?或者如在ListV ...

随机推荐

  1. java 工厂模式的作用,为什么要用工厂模式以及示例演示

    1 工厂模式的作用,为什么要用工厂模式? 工厂模式是为了解耦:把对象的创建和使用的过程分开.就是Class A 想调用Class B,那么只是调用B的方法,而至于B的实例化,就交给工厂类. 工厂模式可 ...

  2. C#基元类型取值范围对照表

    byte   无符号 8 为整数,值为0-255; sbyte   有符号8位整数,-128~127; short   有符号16位整数,范围在-32768~32767 ushort   无符号16位 ...

  3. 双camera景深计算

    https://sanwen8.cn/p/2e41VC5.html 本文系微信公众号<大话成像>,知乎专栏< all in camera>原创文章,转载请注明出处. 接着上一篇 ...

  4. Spring 之 @ComponentScan以及mock Spring MVC

    [ @ComponentScan] 纠正:可以成功 Autowired 的原因是我在另外一个 config 文件中扫描了根包,这会顺带扫描所有该包的子包 还有,,上面的写法容易出错,建议这样写, @C ...

  5. pt-osc原理

    pt-osc原理 1.检查设置环境 测试db是否可连通,并且验证database是否存在 SET SESSION innodb_lock_wait_timeout=1 //InnoDB事务等待行锁的超 ...

  6. SpringBoot2.0+ElasticSearch网盘搜索实现

    1.ES是如何实现分布式高并发全文检索 2.简单介绍ES分片Shards分片技术 3.为什么ES主分片对应的备分片不在同一台节点存放 4.索引的主分片定义好后为什么不能做修改 5.ES如何实现高可用容 ...

  7. jvm-知识点总结

    参考: https://blog.csdn.net/wuqinghai2012/article/details/51485414 http://pengjiaheng.iteye.com/blog/5 ...

  8. 《大型网站系统与JAVA中间件实践》读书笔记-大型网站架构演进

    大型网站架构演进 大型网站是一种很常见的分布式系统,除了海量数据和高并发的访问量,本身业务和系统也复杂. 大型网站的架构演进 我们现在常用的大型网站都是从小网站一步一步发展起来的,这个过程中会 有一些 ...

  9. Linux(CentOS)网络配置

    1. 查看网口连接情况 2.修改网卡 3.修改主机名 4.重新启动网络 5.查看连接ifconfig,ping网络 copyright@2015 liupan liu.pan@datatom.com

  10. scala学习手记22 - 参数化类型的可变性

    java 的代码中多少有些不是很严谨的内容,比如下面的这段代码: public class Trouble { public static void main(String[] args) { Int ...