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解析URL参数示例代码
Aug 12 Javascript
js获取当月最后一天实例代码
Nov 19 Javascript
如何屏蔽防止别的网站嵌入框架代码
Aug 24 Javascript
三种AngularJS中获取数据源的方式
Feb 02 Javascript
jquery实现网站列表切换效果的2种方法
Aug 12 Javascript
基于Bootstrap和jQuery构建前端分页工具实例代码
Nov 23 Javascript
jQuery点击弹出层弹出模态框点击模态框消失代码分享
Jan 21 Javascript
浅谈js函数三种定义方式 & 四种调用方式 & 调用顺序
Feb 19 Javascript
js实现日期显示的一些操作(实例讲解)
Jul 27 Javascript
angular4 共享服务在多个组件中数据通信的示例
Mar 30 Javascript
详解Angular模板引用变量及其作用域
Nov 23 Javascript
如何基于javascript实现贪吃蛇游戏
Feb 09 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下实现农历日历的代码
2007/03/07 PHP
php 面向对象的一个例子
2011/04/12 PHP
php calender(日历)二个版本代码示例(解决2038问题)
2013/12/24 PHP
php实现当前页面点击下载文件的简单方法
2016/09/22 PHP
PHP数据对象映射模式实例分析
2019/03/29 PHP
javascript运行机制之this详细介绍
2014/02/07 Javascript
JavaScript中for-in遍历方式示例介绍
2014/02/11 Javascript
下拉框select的绑定示例
2014/09/04 Javascript
微信小程序商城项目之购物数量加减(3)
2017/04/17 Javascript
详解vue使用vue-layer-mobile组件实现toast,loading效果
2018/08/31 Javascript
vuex存取值和映射函数使用说明
2020/07/24 Javascript
Python实现以时间换空间的缓存替换算法
2016/02/19 Python
python 保存float类型的小数的位数方法
2018/10/17 Python
对python3 中方法各种参数和返回值详解
2018/12/15 Python
python调用opencv实现猫脸检测功能
2019/01/15 Python
Python之虚拟环境virtualenv,pipreqs生成项目依赖第三方包的方法
2019/07/23 Python
Python re 模块findall() 函数返回值展现方式解析
2019/08/09 Python
Python 使用元类type创建类对象常见应用详解
2019/10/17 Python
Django调用支付宝接口代码实例详解
2020/04/04 Python
pip安装提示Twisted错误问题(Python3.6.4安装Twisted错误)
2020/05/09 Python
CSS 3.0 结合video视频实现的创意开幕效果
2020/06/01 HTML / CSS
马克华菲官方商城:Mark Fairwhale
2016/09/04 全球购物
HOTEL INFO英国:搜索全球酒店
2019/08/08 全球购物
美体小铺波兰官方网站:The Body Shop波兰
2019/09/03 全球购物
Perfume’s Club英国官网:购买香水和护肤品
2019/11/02 全球购物
土耳其新趋势女装购物网站:Addax
2020/01/07 全球购物
大学老师推荐信
2014/02/25 职场文书
机房搬迁方案
2014/05/01 职场文书
营销计划书
2015/01/17 职场文书
毕业论文致谢部分怎么写
2015/05/14 职场文书
外出考察学习心得体会
2016/01/18 职场文书
原生JS实现飞机大战小游戏
2021/06/09 Javascript
django 认证类配置实现
2021/11/11 Python
SSM项目使用拦截器实现登录验证功能
2022/01/22 Java/Android
如何让你的Nginx支持分布式追踪详解
2022/07/07 Servers
Three.js实现雪糕地球的使用示例详解
2022/07/07 Javascript