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 相关文章推荐
JavaScript DOM学习第八章 表单错误提示
Feb 19 Javascript
JQuery的Validation插件中Remote验证的中文问题
Jul 26 Javascript
JS中的构造函数详细解析
Mar 10 Javascript
给应用部分的js代码设定一个统一的入口
Jun 15 Javascript
JavaScript使用指针操作实现约瑟夫问题实例
Apr 07 Javascript
完美实现bootstrap分页查询
Dec 09 Javascript
使用AJAX实现Web页面进度条的实例分享
May 06 Javascript
JS实现搜索关键词的智能提示功能
Jul 07 Javascript
浅谈Angular2 ng-content 指令在组件中嵌入内容
Aug 18 Javascript
微信小程序如何获取用户手机号
Jan 26 Javascript
关于微信小程序map组件z-index的层级问题分析
Jul 09 Javascript
JavaScript undefined及null区别实例解析
Jul 21 Javascript
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
全国FM电台频率大全 - 10 江苏省
2020/03/11 无线电
php array_search() 函数使用
2010/04/13 PHP
PHP实现远程下载文件到本地
2015/05/17 PHP
Laravel 简单实现Ajax滚动加载示例
2019/10/22 PHP
JScript中的undefined和"undefined"的区别
2007/03/08 Javascript
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
2012/02/27 Javascript
使用JQUERY进行后台页面布局控制DIV实现左右式
2014/01/07 Javascript
ECMAScript6中Set/WeakSet详解
2015/06/12 Javascript
浅谈toLowerCase和toLocaleLowerCase的区别
2016/08/15 Javascript
又一款MVVM组件 构建自己的Vue组件(2)
2017/03/13 Javascript
Vue2.0结合webuploader实现文件分片上传功能
2018/03/09 Javascript
Vue中使用Sortable的示例代码
2018/04/07 Javascript
js如何找出字符串中的最长回文串
2018/06/04 Javascript
react+ant design实现Table的增、删、改的示例代码
2018/12/27 Javascript
React Hooks 实现和由来以及解决的问题详解
2020/01/17 Javascript
JS如何定义用字符串拼接的变量
2020/07/11 Javascript
详解Node.JS模块 process
2020/08/31 Javascript
JS实现无限轮播无倒退效果
2020/09/21 Javascript
微信小程序:报错(in promise) MiniProgramError
2020/10/30 Javascript
Python黑魔法Descriptor描述符的实例解析
2016/06/02 Python
Python reduce()函数的用法小结
2017/11/15 Python
python导入模块交叉引用的方法
2019/01/19 Python
Python如何爬取微信公众号文章和评论(基于 Fiddler 抓包分析)
2019/06/28 Python
用python批量移动文件
2021/01/14 Python
HTML5轻松实现全屏视频背景的示例
2018/04/23 HTML / CSS
美国著名珠宝品牌之一:Jared The Galleria Of Jewelry
2016/10/01 全球购物
Ralph Lauren意大利官方网站:时尚界最负盛名的品牌之一
2018/10/18 全球购物
介绍JAVA 中的Collection FrameWork(及如何写自己的数据结构)
2014/10/31 面试题
优秀大学生推荐信范文
2013/11/28 职场文书
电子商务网站的创业计划书
2014/01/05 职场文书
2014最新离职证明范本
2014/09/12 职场文书
领导班子对照检查剖析材料
2014/10/13 职场文书
外出考察学习心得体会
2016/01/18 职场文书
给原生html中添加水印遮罩层的实现示例
2021/04/02 Javascript
Python中使用subprocess库创建附加进程
2021/05/11 Python
Golang 结构体数据集合
2022/04/22 Golang