Javascript学习笔记之 对象篇(四) : for in 循环


Posted in Javascript onJune 24, 2014

先上范例:

// Poisoning Object.prototype
Object.prototype.bar = 1;

var foo = {moo: 2};
for(var i in foo) {
 console.log(i); // prints both bar and moo
}

这里我们要注意两点,一是 for in 循环会忽略 enumerable 设置为 false 的属性。例如一个数组的 length 属性。第二是,由于 for in 会遍历整个原型链,所以当原型链过长时,会对性能造成影响。

 enumerable 是个很陌生的词汇,实际上,你很难在 javascript 中发现它的影子,而它实际上也是作者从 ruby 中借鉴而来的。创建 enumerable 的目的不是为了独立使用,而是采用“混用”的方式,而 Prototype 中很多方法都混用了 enumerable,所以它可以说是 prototype 的奠基石。这里不做详细介绍,详细内容可以参考 - Enumerable。
由于我们没法改变 for in 循环本身的行为,所以我们只能采取其他方法来过滤掉那些不希望出现在循环内的属性,通过 《Javascript学习笔记之对象篇(三) : hasOwnProperty》 我们知道 hasOwnProperty 方法是可以做到这一点的。

使用 hasOwnProperty 过滤

仍然使用上个例子:

// Poisoning Object.prototype
Object.prototype.bar = 1;

var foo = {moo: 2};
 for(var i in foo) {
 if (foo.hasOwnProperty(i)) {
  console.log(i);
 }
 }

这是唯一正确的写法,由于我们实用了 hasOwnProperty 方法,所以这次只输出 moo。如果不适用 hasOwnProperty 方法,那么当 Object.prototype 扩展时,就会出现错误。
现在很多框架都会选择从 Object.prototype 扩展方法,所以我们使用这些框架时,如果使用没有用 hasOwnProperty 过滤的 for in 循环时就会遇到问题。

总结

建议养成 hasOwnProperty 过滤属性的好习惯,不要对运行环境做任何假设,也无论原生的原型对象是否被扩展。

Javascript 相关文章推荐
Javascript 模式实例 观察者模式
Oct 24 Javascript
复制Input内容的js代码_支持所有浏览器,修正了Firefox3.5以上的问题
Jun 21 Javascript
JQuery魔力之$("tagName")与selector
Mar 05 Javascript
javascript使用中为什么10..toString()正常而10.toString()出错呢
Jan 11 Javascript
浅谈JS闭包中的循环绑定处理程序
Nov 09 Javascript
学习JavaScript设计模式(策略模式)
Nov 26 Javascript
js倒计时小实例(多次定时)
Dec 08 Javascript
vue.js的提示组件
Mar 02 Javascript
微信小程序使用navigateTo数据传递的实例
Sep 26 Javascript
Vue加载json文件的方法简单示例
Jan 28 Javascript
node中实现删除目录的几种方法
Jun 24 Javascript
微信小程序实现自定义动画弹框/提示框的方法实例
Nov 06 Javascript
Javascript学习笔记之 对象篇(三) : hasOwnProperty
Jun 24 #Javascript
js实现div闪烁原理及实现代码
Jun 24 #Javascript
Javascript 学习笔记之 对象篇(二) : 原型对象
Jun 24 #Javascript
Javascript学习笔记之 对象篇(一) : 对象的使用和属性
Jun 24 #Javascript
jQuery学习笔记之 Ajax操作篇(三) - 过程处理
Jun 23 #Javascript
jquery 为a标签绑定click事件示例代码
Jun 23 #Javascript
a标签click和href执行顺序探讨
Jun 23 #Javascript
You might like
请php正则走开
2008/03/15 PHP
php5中类的学习
2008/03/28 PHP
PHP无敌近乎加密方式!
2010/07/17 PHP
php-app开发接口加密详解
2018/04/18 PHP
PHP设计模式入门之状态模式原理与实现方法分析
2020/04/26 PHP
PHP程序员简单的开展服务治理架构操作详解(三)
2020/05/14 PHP
ext监听事件方法[初级篇]
2008/04/27 Javascript
javascript面向对象入门基础详细介绍
2012/09/05 Javascript
JavaScript实现对下拉列表值进行排序的方法
2015/07/15 Javascript
js实现分割上传大文件
2016/03/09 Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
2016/10/01 Javascript
AngularJS开发教程之控制器之间的通信方法分析
2016/12/25 Javascript
js实现带简单弹性运动的导航条
2017/02/22 Javascript
nodejs前端自动化构建环境的搭建
2017/07/26 NodeJs
解决angular2 获取到的数据无法实时更新的问题
2018/08/31 Javascript
JavaScript事件对象深入详解
2018/12/30 Javascript
微信小程序视图控件与bindtap之间的问题的解决
2019/04/08 Javascript
详解vue更改头像功能实现
2019/04/28 Javascript
Vue.js中的extend绑定节点并显示的方法
2019/06/20 Javascript
Layui之table中的radio在切换分页时无法记住选中状态的解决方法
2019/09/02 Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
2019/10/29 Javascript
python去除所有html标签的方法
2015/05/05 Python
python获取程序执行文件路径的方法(推荐)
2018/04/26 Python
Python实现12306火车票抢票系统
2019/07/04 Python
tensorflow dataset.shuffle、dataset.batch、dataset.repeat顺序区别详解
2020/06/03 Python
Python基于unittest实现测试用例执行
2020/11/25 Python
python 合并多个excel中同名的sheet
2021/01/22 Python
台湾7-ELEVEN线上购物中心:7-11
2021/01/21 全球购物
装潢设计实习自我鉴定
2013/09/19 职场文书
会计专业毕业生自荐信范文
2013/12/20 职场文书
党员查摆剖析材料
2014/10/10 职场文书
汽车转让协议书范本
2014/12/07 职场文书
2014年副班长工作总结
2014/12/10 职场文书
2014年底工作总结
2014/12/15 职场文书
闪闪红星观后感
2015/06/08 职场文书
士兵突击观后感
2015/06/16 职场文书