Javascript中的for in循环和hasOwnProperty结合使用


Posted in Javascript onJune 05, 2013

与in操作符相比,for in 在循环对象的属性时也会遍历原型链,for in 不会读取不可枚举属性,如数组的length属性。 小结 当检测某个对象是否拥有某个属性时,hasOwnProperty 是唯一可以完成这一任务的方法,在 for in 循环时,建议增加 hasOwnProperty 进行判断,可以有效避免扩展本地原型而引起的错误。

与in操作符相比,for in 在循环对象的属性时也会遍历原型链,for in 不会读取不可枚举属性,如数组的length属性。

// 扩展 Object.prototype 
Object.prototype.bar = 1; 
var foo = {moo: 2}; 
for(var i in foo) { 
console.log(i); // 输出 bar 和 moo 
}

我们不可能改变 for in 循环的行为,当需要对循环体内某些属性进行过滤时,可以利用Object.prototype的hasOwnProperty方法来完成。

提示:因为 for in 循环总是遍历整个原型链,所以当遍历多继承的对象时效率较低。

使用 hasOwnProperty 进行过滤

// 仍旧针对上例的foo对象 
for (var i in foo) { 
if (foo.hasOwnProperty(i)) { 
console.log(i); 
} 
}

例子中因为使用了hasOwnProperty,最终输出moo;如果忽略 hasOwnProperty ,代码将会输出非预期结果,因为本地原型(如Object.prototype)已经被扩展了。

Prototype框架就是扩展Javascript原始对象的一个类库,并被广泛使用,其缺点也很明显,当框架引入后,如果不使用 hasOwnProperty 进行过滤判断,输出结果保证不是你想要的。

最佳实践

推荐在 for in 时,总是使用 hasOwnProperty 进行判断,没人可以保证运行的代码环境是否被污染过。

hasOwnProperty
为了检查某个对象是否拥有不在原型链上的自定义属性,就有必要用到 hasOwnProperty 方法,任何一个对象都具有该方法,它继承自 Object.prototype。

提示:我们无法完全检测某个属性是否是undefined,因为属性有可能存在,但其值为undefined。hasOwnProperty 是Javascript中唯一一个可以处理对象属性而不遍历原型链的方法。

// 扩展 Object.prototype 
Object.prototype.bar = 1; 
var foo = {goo: undefined}; foo.bar; // 1 
'bar' in foo; // true 
foo.hasOwnProperty('bar'); // false 
foo.hasOwnProperty('goo'); // true

只有 hasOwnProperty 给出了正确的预期结果,当遍历对象的属性时这是很有必要的,没有其它办法来排除定义在对象原型链上的属性。

hasOwnProperty 作为属性

Javascript 并没有保护 hasOwnProperty 为关键字或保留字,因此,如果某个对象拥有同名的属性,就有必要利用扩展的 hasOwnProperty 来获取正确结果。

var foo = { 
hasOwnProperty: function() { 
return false; 
}, 
bar: 'Here be dragons' 
}; 
foo.hasOwnProperty('bar'); // 总是返回 false 
// 使用另一个 hasOwnProperty 并将 this 设置为 foo 来调用它 
{}.hasOwnProperty.call(foo, 'bar'); // true

小结
当检测某个对象是否拥有某个属性时,hasOwnProperty 是唯一可以完成这一任务的方法,在 for in 循环时,建议增加 hasOwnProperty 进行判断,可以有效避免扩展本地原型而引起的错误。

Javascript 相关文章推荐
Mootools 1.2教程 排序类和方法简介
Sep 15 Javascript
解析img图片没找到onerror事件 Stack overflow at line: 0
Dec 23 Javascript
JQuery自动触发事件的方法
Jun 13 Javascript
jQuery实现灰蓝风格标准二级下拉菜单效果代码
Aug 31 Javascript
js实现接收表单的值并将值拼在表单action后面的方法
Nov 23 Javascript
Ztree新增角色和编辑角色回显问题的解决
Oct 25 Javascript
利用NPM淘宝的node.js镜像加速nvm
Mar 27 Javascript
JavaScript使用链式方法封装jQuery中CSS()方法示例
Apr 07 jQuery
基于Vue-cli快速搭建项目的完整步骤
Nov 03 Javascript
JavaScript实现PC端横向轮播图
Feb 07 Javascript
js、jquery实现列表模糊搜索功能过程解析
Mar 27 jQuery
小程序实现列表展开收起效果
Jul 29 Javascript
理解JAVASCRIPT中hasOwnProperty()的作用
Jun 05 #Javascript
jquery 面包屑导航 具体实现
Jun 05 #Javascript
JSCode all of Brower 全局屏蔽网页右键功能 具体实现
Jun 05 #Javascript
js 获取后台的字段 改变 checkbox的被选中的状态 代码
Jun 05 #Javascript
JQuery AJAX 中文乱码问题解决
Jun 05 #Javascript
Javascript自定义排序 node运行 实例
Jun 05 #Javascript
jquery 文本上下无缝滚动,鼠标放上去就停止 小例子
Jun 05 #Javascript
You might like
数据库的日期格式转换
2006/10/09 PHP
PHP setcookie设置Cookie用法(及设置无效的问题)
2011/07/13 PHP
php生成txt文件标题及内容的方法
2014/01/16 PHP
ajax无刷新动态调用股票信息(改良版)
2008/11/01 Javascript
jquery实现心算练习代码
2010/12/06 Javascript
JavaScript中数组的排序、乱序和搜索实现代码
2011/11/30 Javascript
在javascript中关于节点内容加强
2013/04/11 Javascript
JavaScript操作HTML DOM节点的基础教程
2016/03/11 Javascript
AngularJS入门教程之AngularJS表达式
2016/04/18 Javascript
js实现日历的简单算法
2017/01/24 Javascript
浅谈Node Inspector 代理实现
2017/10/19 Javascript
vue vue-Router默认hash模式修改为history需要做的修改详解
2018/09/13 Javascript
详解Angular5/Angular6项目如何添加热更新(HMR)功能
2018/10/10 Javascript
vue单页面在微信下只能分享落地页的解决方案
2019/04/15 Javascript
详解element-ui中表单验证的三种方式
2019/09/18 Javascript
VUE实现自身整体组件销毁的示例代码
2020/01/13 Javascript
vue ssr+koa2构建服务端渲染的示例代码
2020/03/23 Javascript
python中global与nonlocal比较
2014/11/21 Python
推荐10款最受Python开发者欢迎的Python IDE
2018/09/16 Python
python实现将一维列表转换为多维列表(numpy+reshape)
2019/11/29 Python
python实现拼接图片
2020/03/23 Python
基于PyTorch的permute和reshape/view的区别介绍
2020/06/18 Python
python 写一个文件分发小程序
2020/12/05 Python
新西兰最大的品牌运动鞋购物网站:Platypus NZ
2017/10/27 全球购物
英国领先的电视购物零售商:Ideal World
2019/03/18 全球购物
Servlet的生命周期
2013/08/25 面试题
财务管理职业生涯规划范文
2013/12/27 职场文书
保险公司晨会主持词
2014/03/22 职场文书
出国留学经济担保书
2014/04/01 职场文书
学校师德师风自我剖析材料
2014/09/29 职场文书
2014年科室工作总结范文
2014/12/19 职场文书
应届毕业生的自我评价
2019/06/21 职场文书
四年级作文之植物
2019/09/20 职场文书
解决Golang中goroutine执行速度的问题
2021/05/02 Golang
教你用Python+selenium搭建自动化测试环境
2021/06/18 Python
《战锤40K:暗潮》跳票至9月 公布新宣传片
2022/04/03 其他游戏