Javascript学习笔记之数组的遍历和 length 属性


Posted in Javascript onNovember 23, 2014

尽管数组在 Javascript 中是对象,但是不建议使用 for in 循环来遍历数组,实际上,有很多理由来阻止我们对数组使用 for in 循环。
因为 for in 循环将会枚举原型链上的所有属性,并且唯一阻止的方法是使用 hasOwnProperty 来判断,这将比普通的 for 循环要慢不少。

遍历

为了达到最佳性能来遍历一个数组,最好的方式就是使用经典的 for 循环。

var list = [1, 2, 3, 4, 5, ...... 100000000];

for(var i = 0, l = list.length; i < l; i++) {

    console.log(list[i]);

}

这儿有一个额外的技巧,就是通过 l = list.length 来缓存数组的长度。
尽管属性 length 是定义在数组本身的,但是在循环的每一次遍历时仍然会有开销。尽管最新的 Javascript 引擎可能已经对这种情况作了性能上的优化,但是你并不能保证你的 Javascript 代码会一直在这种浏览器上运行。
实际上,不缓存长度的循环要比缓存长度的循环性能上慢不少。

length 属性

尽管 length 属性仅仅通过 getter 方法返回数组中元素的个数,但是可以通过 setter 方法来截断数组。

var foo = [1, 2, 3, 4, 5, 6];

foo.length = 3;

foo; // [1, 2, 3]

foo.length = 6;

foo.push(4);

foo; // [1, 2, 3, undefined, undefined, undefined, 4]

给 length 属性赋值一个更小的数将会截断数组,如果赋值一个更大的数则不会截断数组。

总结

为了性能达到最优,建议使用 for 循环而不是使用 for in 循环,同时缓存 length 属性。

还有数组对象是没有任何方法的,只有一个唯一的属性length。字符串对象是有length方法的~~

Javascript 相关文章推荐
跟随鼠标旋转的文字
Nov 30 Javascript
jquery 表单取值常用代码
Dec 22 Javascript
Ext 今日学习总结
Sep 19 Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
Apr 18 Javascript
在JavaScript的jQuery库中操作AJAX的方法讲解
Aug 15 Javascript
详解PHP中pathinfo()函数导致的安全问题
Jan 05 Javascript
Vue自定义指令详解
Jul 28 Javascript
浅析JavaScript中的特殊数据类型
Dec 15 Javascript
解决Vue2.x父组件与子组件之间的双向绑定问题
Mar 06 Javascript
浅谈在Vue.js中如何实现时间转换指令
Jan 06 Javascript
layui表格数据复选框回显设置方法
Sep 13 Javascript
vue特效之翻牌动画
Apr 20 Vue.js
Javascript 赋值机制详解
Nov 23 #Javascript
Javascript学习笔记之函数篇(六) : 作用域与命名空间
Nov 23 #Javascript
Javascript学习笔记之函数篇(五) : 构造函数
Nov 23 #Javascript
Javascript学习笔记之函数篇(四):arguments 对象
Nov 23 #Javascript
Javascript学习笔记之 函数篇(三) : 闭包和引用
Nov 23 #Javascript
js实例属性和原型属性示例详解
Nov 23 #Javascript
JS常用函数使用指南
Nov 23 #Javascript
You might like
实例(Smarty+FCKeditor新闻系统)
2007/01/02 PHP
PHP中实现汉字转区位码应用源码实例解析
2010/06/14 PHP
php 目录与文件处理-郑阿奇(续)
2011/07/04 PHP
解析thinkphp的左右值无限分类
2013/06/20 PHP
php setcookie函数的参数说明及其用法
2014/04/20 PHP
PHP中抽象类、接口的区别与选择分析
2016/03/29 PHP
PHP文件系统管理(实例讲解)
2017/09/19 PHP
JQuery的自定义事件代码,触发,绑定简单实例
2013/08/01 Javascript
jquery实现图片渐变切换兼容ie6/Chrome/Firefox
2013/08/02 Javascript
javascript随机将第一个dom中的图片添加到第二个div中示例
2013/10/08 Javascript
jQuery实现拖动调整表格单元格大小的代码实例
2015/01/13 Javascript
jquery滚动特效集锦
2015/06/03 Javascript
AngularJs Injecting Services Into Controllers详解
2016/09/02 Javascript
Bootstrap简单表单显示学习笔记
2016/11/15 Javascript
Node.js中的http请求客户端示例(request client)
2017/05/04 Javascript
react native实现往服务器上传网络图片的实例
2017/08/07 Javascript
bootstrap table服务端实现分页效果
2017/08/10 Javascript
基于vue.js中事件修饰符.self的用法(详解)
2018/02/23 Javascript
p5.js入门教程和基本形状绘制
2018/03/15 Javascript
Vue-cli3简单使用(图文步骤)
2019/04/30 Javascript
Python线程下使用锁的技巧分享
2018/09/13 Python
Python爬虫实现验证码登录代码实例
2019/05/10 Python
TensorFlow获取加载模型中的全部张量名称代码
2020/02/11 Python
Django 博客实现简单的全文搜索的示例代码
2020/02/17 Python
配置python的编程环境之Anaconda + VSCode的教程
2020/03/29 Python
用pushplus+python监控亚马逊到货动态推送微信
2021/01/29 Python
英国二手iPhone、音乐、电影和游戏商店:musicMagpie
2018/10/26 全球购物
英国剑桥包中文官网:The Cambridge Satchel Company中国
2018/11/06 全球购物
init进程的作用
2015/08/20 面试题
25岁生日感言
2014/01/13 职场文书
京剧自荐信
2014/01/26 职场文书
2015年车间管理工作总结
2015/07/23 职场文书
小学班级口号大全
2015/12/25 职场文书
Python控制台输出俄罗斯方块的方法实例
2021/04/17 Python
python实现简单的井字棋
2021/05/26 Python
使用CSS实现百叶窗效果示例代码
2023/05/07 HTML / CSS