JavaScript for in的缺陷
for in 语句用来列举对象的属性(成员),如下
1
2
3
4
5
6
7
|
var obj = { name: "jack" , getName: function (){ return this .name} }; //输出name,getName for ( var atr in obj) { alert(atr); } |
注意了吗,没有输出obj的toString,valueOf等内置属性(或称内置成员,隐藏属性和预定义属性)。即for in用来列举对象的显示成员(自定义成员)。
如果重写了内置属性呢,下面就重写obj的toString
1
2
3
4
5
6
7
|
var obj = {name: "jack" , getName: function (){ return this .name}, toString: function (){ return "I'm jack." } } for ( var atr in obj) { alert(atr); } |
会输出什么呢?
1、IE6/7/8 下和没有重写toString一样,仍然只输出name,getName
2、IE9/Firefox/Chrome/Opera/Safari下则输出name,getName,toString
如果给内置原型添加属性/方法,那么for in时也是可遍历的
1
2
3
4
5
6
7
8
9
|
Object.prototype.clone = function () {} var obj = { name: 'jack' , age: 33 } // name, age, clone for ( var n in obj) { alert(n) } |
给Object.prototype添加了方法clone,for in时所有浏览器都显示了clone。
这或许还没什么,因为一般不建议去扩展内置构造器的原型,这也是Prototype.js走向没落的原因之一。jQuery和Underscore没有扩展自原型,前者在jQuery对象上做文章,后者索性将所有方法都挂在下划线上。
但有时我们为了兼容ES5或后续版本,会在不支持ES5的浏览器上(IE6/7/8)去扩展内置构造器的原型,这时for in在各浏览器中就不同了。如下
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
if (!Function.prototype.bind) { Function.prototype.bind = function (scope) { var fn = this return function () { fn.apply(scope, arguments) } } } function greet(name) { alert( this .greet + ', ' + name) } for ( var n in greet) { alert(n) } |
IE6/7/8输出了bind,其它浏览器则无。因为现代浏览器中bind是原生支持的,for in不到,IE6/7/8则是给Function.prototype添加了bind。
总结下:在跨浏览器的设计中,我们不能依赖于for in来获取对象的成员名称,一般使用hasOwnProperty来判断下。
JavaScript for in的缺陷的更多相关文章
- JavaScript的坑,缺陷
JavaScript的缺陷 1.在做判断的时候用=======而不是== 2.浮点预算有精度问题 通过差值去把这个精度锁定到一个范围 Math. Abs(A-B)<0.0001** 3.null ...
- React Native:使用 JavaScript 构建原生应用
[转载] 本篇为联合翻译,译者:寸志,范洪春,kmokidd,姜天意 数月前,Facebook 对外宣布了正在开发的 React Native 框架,这个框架允许你使用 JavaScript 开发原生 ...
- 深入浅出 React Native:使用 JavaScript 构建原生应用
深入浅出 React Native:使用 JavaScript 构建原生应用 链接:https://zhuanlan.zhihu.com/p/19996445 原文:Introducing React ...
- 关于Javascript的内存泄漏问题的整理稿
写了好长时间javascript小功能模块,从来没有关注过内存泄漏问题.记得以前写C++程序的时候,内存泄漏是个严重的问题,我想是时候关注一下了.网上找了篇文章,Mark一下.原文地址:http:// ...
- React Native:使用 JavaScript 构建原生应用 详细剖析
数月前,Facebook 对外宣布了正在开发的 React Native 框架,这个框架允许你使用 JavaScript 开发原生的 iOS 应用——就在今天,Beta 版的仓库释出了! 基于 Pho ...
- JavaScript 归纳
MDN 本文以 NodeJS 为交互解释器实验 尽量遵循 ES6 标准 javascript 重点 1.javascript 是单线程,通过 EventLoop 实现模拟异步,其中包括宏任务,微任务 ...
- 从零开始学 Web 之 JavaScript(一)JavaScript概述
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识 ...
- 知识点【JavaScript模块化】
JavaScript模块化历程 JavaScript发展变迁大概是一下几个步骤: 工具(浏览器兼容) 组件(功能模块) 框架(功能模块组织) 应用(业务模块组织) 但是经过了长长的后天努力过程Java ...
- Javascript 创建对象的三种方法及比较【转载+整理】
https://developer.mozilla.org/zh-CN/docs/JavaScript/Guide/Inheritance_and_the_prototype_chain 本文内容 引 ...
随机推荐
- Net Core中数据库事务隔离详解——以Dapper和Mysql为例
Net Core中数据库事务隔离详解--以Dapper和Mysql为例 事务隔离级别 准备工作 Read uncommitted 读未提交 Read committed 读取提交内容 Repeatab ...
- 【JS】数据类型
其他类型转化为boolean类型规则: number:非0为true,0和NaN为false: String:非空为true,空为false: Object:任何对象都为true 任何变量赋值为nul ...
- 【MySQL】查看支持的字符集show character set;
- 无 new 构造与链式调用
无 new 构造 最简单的想法 (function(window) { var jQuery = function() { return new _jQuery(); }; var _jQuery = ...
- 贪心算法——Fence Repair(POJ 3253)
题目描述 农夫约翰为了修理栅栏,要将一块很长的木板切割成N块.准备切成的木板长度为L1,L2,L3--LN,未切割前木板的长度恰好为切割后木板长度的总和.每次切断木板时,需要的开销为这块木板的长度.请 ...
- Java 伙伴系统(模拟)
参考:https://labrick.cc/2015/10/12/buddy-system-algorithm/ 代码过烂 不宜参考. output: [operating.entity.Heap@4 ...
- ArcGIS API for JavaScript 4.2学习笔记[0] AJS4.2概述、新特性、未来产品线计划与AJS笔记目录
放着好好的成熟的AJS 3.19不学,为什么要去碰乳臭未干的AJS 4.2? 4.2全线基础学习请点击[直达] 4.3及更高版本的补充学习请关注我的博客. ArcGIS API for JavaScr ...
- 强推一款开源集成开发环境——Geany
本人是一个标标准准的程序员,集成开发环境在电脑上大概看一下有:Code Blocks(C/C++),VS(C#,C/C++),eclipse(Java),Hbuild和web storm(前端),py ...
- BZOJ4817 SDOI2017 相关分析
4821: [Sdoi2017]相关分析 Time Limit: 10 Sec Memory Limit: 128 MBSec Special Judge Description Frank对天文 ...
- hello world 为什么我们看到学习中有这一句话!!!
Hello World ,中文意思:你好,世界.世界上的第一个程序就是Hello World,由Brian Kernighan创作. Hello, world"程序是指在计算机屏幕上输出“H ...