JavaScript中for-in遍历方式示例介绍


Posted in Javascript onFebruary 11, 2014

摘要:for-in遍历方式的循环计数器是字符串类型,遍历对象时为对象属性/方法名,遍历数组时为数组元素下标索引,与普通的for循环不同,for-in会将继承的属性/方法列出,这一点在使用时需要特别关注。

除了传统的for循环,JavaScript为遍历操作定义了for-in方式,根据数据源的不同,在使用时存在差异。
(1)遍历对象:

var fish = { 
head : 1, 
tail : 1, 
} 
for(var prop in fish) { 
console.log(fish[prop]); 
}

调试时观察:prop依次为'head','tail',即遍历对象属性时是以字符串类型存在的,循环计数器为对象的属性名。
(2)遍历数组
var arr = ['one', 'two', 'three']; 
for(var prop in arr) { 
console.log(prop); 
}

调试时观察:prop依次为'0','1',即遍历数组时仍是以字符串类型存在,不同的是循环计数器为数组元素的下标。(这时可以试试用for循环输出,结果与for-in是一致的)
如果代码中加入:
if(Object.prototype.clone === 'undefined') 
Object.prototype.clone = function() {};

则输出结果为:0,1,clone
如果这时用for循环输出,则仍为0,1;也就是说for-in循环会将当前操作的数据源所属类型具有的属性遍历出来(同样对对象fish用for-in时,也会输出clone),所以就要求在使用for-in遍历时拉着一根弦:如果仅对对象自有属性操作,需要将继承来的属性加以剔除,比如用hasOwnProperty()方法。
Javascript 相关文章推荐
浅谈页面装载js及性能分析方法
Dec 09 Javascript
JavaScript中switch语句的用法详解
Jun 03 Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
Jan 20 Javascript
Vue-Router实现页面正在加载特效方法示例
Feb 12 Javascript
基于Vue2的独立构建与运行时构建的差别(详解)
Dec 06 Javascript
js实时监控文本框输入字数的实例代码
Jan 18 Javascript
解决Vue2.x父组件与子组件之间的双向绑定问题
Mar 06 Javascript
layui的数据表格+springmvc实现搜索功能的例子
Sep 28 Javascript
javascript设计模式 ? 备忘录模式原理与用法实例分析
Apr 21 Javascript
JQuery绑定事件四种实现方法解析
Dec 02 jQuery
jQuery实现手风琴特效
Jan 11 jQuery
vue css 相对路径导入问题级踩坑记录
Jun 05 Vue.js
Chrome扩展页面动态绑定JS事件提示错误
Feb 11 #Javascript
关于页面嵌入swf覆盖div层的问题的解决方法
Feb 11 #Javascript
关闭浏览器输入框自动补齐 兼容IE,FF,Chrome等主流浏览器
Feb 11 #Javascript
js读取配置文件自写
Feb 11 #Javascript
JS检测输入字符是否包含非法字符的示例代码
Feb 11 #Javascript
JS(JQuery)操作Array的相关方法介绍
Feb 11 #Javascript
jquery 字符串切割函数substring的用法说明
Feb 11 #Javascript
You might like
php实现mysql事务处理的方法
2014/12/25 PHP
PHP使用Redis长连接的方法详解
2018/02/12 PHP
PHP的mysqli_ssl_set()函数讲解
2019/01/23 PHP
Code:loadScript( )加载js的功能函数
2007/02/02 Javascript
JavaScript 工具库 Cloudgamer JavaScript Library v0.1 发布
2009/10/29 Javascript
jQuery插件 tabBox实现代码
2010/02/09 Javascript
Jquery实现页面加载时弹出对话框代码
2013/04/19 Javascript
jquery 操作iframe的几种方法总结
2013/12/13 Javascript
js网页右下角提示框实例
2014/10/14 Javascript
js去除浏览器默认底图的方法
2015/06/08 Javascript
简介JavaScript中的push()方法的使用
2015/06/09 Javascript
js控制文本框只能输入中文、英文、数字与指定特殊符号的实现代码
2016/09/09 Javascript
微信小程序 toast 详解及实例代码
2016/11/09 Javascript
Angularjs使用ng-repeat中$even和$odd属性的注意事项
2016/12/31 Javascript
JavaScript简单计算人的年龄示例
2017/04/15 Javascript
利用Javascript开发一个二维周视图日历
2017/12/14 Javascript
vue动态绑定class选中当前列表变色的方法示例
2018/12/19 Javascript
在Vue中使用this.$store或者是$route一直报错的解决
2019/11/08 Javascript
[03:56]还原FTP电影首映式 DOTA2群星拼出遗迹世界
2014/03/26 DOTA
举例介绍Python中的25个隐藏特性
2015/03/30 Python
Python数据结构之栈、队列的实现代码分享
2017/12/04 Python
python机器学习之神经网络实现
2018/10/13 Python
pytorch: Parameter 的数据结构实例
2019/12/31 Python
Jupyter notebook 远程配置及SSL加密教程
2020/04/14 Python
python 发送邮件的四种方法汇总
2020/12/02 Python
CSS3绘制圆角矩形的简单示例
2015/09/28 HTML / CSS
澳大利亚礼品卡商店:Gift Card Store
2019/06/24 全球购物
如何写一个自定义标签
2012/12/28 面试题
迟到检讨书900字
2014/01/14 职场文书
幼儿园门卫制度
2014/01/29 职场文书
婚礼主持结束词
2014/03/13 职场文书
北京故宫的导游词
2015/01/31 职场文书
2016年大学迎新工作总结
2015/10/14 职场文书
2019年亲子运动会口号
2019/10/11 职场文书
解决sql server 数据库,sa用户被锁定的问题
2021/06/11 SQL Server
Redis Cluster 集群搭建你会吗
2021/08/04 Redis