在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. PAT 天梯赛 L1-001 【水】

    L1-001. Hello World 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 这道超级简单的题目没有任何输入. 你只需要在一行中输 ...

  2. Flume1.7.0概述

    Flume概述 常见的开源数据收集系统有: 非结构数据(日志)收集 Flume 结构化数据收集(传统数据库与 Hadoop 同步) Sqoop:全量导入 Canal(alibaba):增量导入 Dat ...

  3. 操作JavaScript数组

    unshift:在数据首段添加元素. push: 在数组的末端添加元素. shift:移除并返回第一个元素,会影响 数组长度. pop:移除并返回最后一个元素.会影响 数组长度. delete  数组 ...

  4. Web安全学习笔记之HTTP协议

    HTTP是一个应用层协议,主要用于Web开发,通常由HTTP客户端发起一个请求,创建一个到服务器指定端口(默认是80端口)的TCP连接.HTTP服务器则在那个端口监听客户端的请求.一旦收到请求,服务器 ...

  5. Nginx 域名跳转

    域名跳转 就是实现URL的跳转和隐藏真实地址,基于Perl语言的正则表达式规范.平时帮助我们实现拟静态,拟目录,域名跳转,防止盗链等 . 域名跳转配置 1.多域名指定一个域名重定向 # 空格分割域名 ...

  6. jQuery可自动播放动画的焦点图

    在线演示 本地下载

  7. Monkey测试命令【学习笔记】

    monkey --ignore-crashes --ignore-timeouts --ignore-security-exceptions --ignore-native-crashes -v 30 ...

  8. HDU 1241 油田

    这道题明明很简单但不知道为什么运行结果一直错,但提交却是对的!代码真是神奇,不过我猜测可能是提上给出的数据错了,可能提上给的数据m和n后多给了一个空格或回车,但题的数据没有 #include<s ...

  9. java用servlet、cookie实现一个阅读记录

    效果如图 代码1 package com.xiaostudy.servlet; import java.io.IOException; import java.io.PrintWriter; impo ...

  10. eclipse里启动rabbitmq报错 java.net.SocketException: Connection reset

    RabbitMQ学习之Java客户端连接测试(二) https://blog.csdn.net/roc1029/article/details/51249412 使用guest用户远程连接Rabbit ...