Javascript学习笔记-详解in运算符


Posted in Javascript onSeptember 13, 2011

一、判断
语法
prop in objectName
如果objectName指向的对象中含有prop这个属性或者键值,in运算符会返回true。

var arr = ['one','two','three','four']; 
arr.five = '5'; 
0 in arr;//true 
'one' in arr; //false,只可判断数组的键值 
'five' in arr;//true,'five'是arr对象的属性 
'length' in arr;//true

原型链
in运算符会在整个原型链上查询给定的prop属性
Object.prototype.sayHello = 'hello,world'; 
var foo = new Object(); 
'sayHello' in foo;//true; 
'toString' in foo;//true; 
'hasOwnProperty' in foo;//true;

对象与字面量
in运算符在对待某些特定类型(String,Number)的对象和字面量时显得不尽相同
var sayHelloObj = new String('hello,world'); 
var sayHello = 'hello,world'; 
var numObj = new Number(1); 
var num = 1; 'toString' in sayHelloObj; //true 
'toString' in sayHello; //类型错误 
'toString' in numObj;//true 
'toString' in num;//类型错误

究其原因,在MDN找到这样一段关于String对象和字面量转换的介绍,似乎可以解释这个原因:

Because JavaScript automatically converts between string primitives and String objects, you can call any of the methods of the String object on a string primitive. JavaScript automatically converts the string primitive to a temporary String object, calls the method, then discards the temporary String object. For example, you can use the String.length property on a string primitive created from a string literal
试着这样理解:因为in是运算符而非一个方法(method),所以无法让string字面量自动转换成String对象,又因为in运算符待查询方不是对象而是一个字符串(按老道Douglas的说法,只是object-like的类型),所以报类型错误。

二、遍历

很常用到的for...in循环语句,此语句中的in需要遵循另外一套语法规范:

for (variable in object)
statement
与单独使用in作为运算符不同,for...in循环语句只遍历用户自定义的属性,包括原型链上的自定义属性,而不会遍历内置(build-in)的属性,如toString。

对象

function Bird(){ 
this.wings = 2; 
this.feet = 4; 
this.flyable = true; 
} 
var chicken = new Bird(); 
chicken.flyable = false; 
for(var p in chicken){ 
alert('chicken.' + p + '=' + chicken[p]); 
}

String对象,经过测试Firefox,Chrome,Opera,Safari浏览器都是给出了注释中的结果,只有IE浏览器只给出'more'和'world'
var str = new String('hello'); 
str.more = 'world'; 
for(var p in str){ 
alert(p);//'more',0,1,2,3,4 
alert(str[p]);//'world','h','e','l','l','o' 
}

字面量
遍历数组字面量的键值和属性
var arr = ['one','two','three','four']; 
arr.five = 'five'; 
for(var p in arr){ 
alert(arr[p]);//'one','two','three','four','five' 
}

遍历string字面量,虽说单独在string字面量前面使用in运算符会报类型错误,不过下面的代码却能够正常运行,此时IE浏览器是毫无声息
var str = 'hello'; 
str.more = 'world'; 
for(var p in str){ 
alert(p);//0,1,2,3,4 
alert(str[p]);//'h','e','l','l','o' 
}

综上
ECMA虽然有这方面的规范,但浏览器之间还是存在着差异,鉴于此,并不推荐用for...in去遍历字符串,也不推荐拿去遍历数组(如例子所示,为数组加上自定义属性,遍历就会被搞乱)

在遍历对象方面,我们还可以使用对象的内置方法hasOwnProperty()排除原型链上的属性,进一步加快遍历速度,提升性能

function each( object, callback, args ){ 
var prop; 
for( prop in object ){ 
if( object.hasOwnProperty( i ) ){ 
callback.apply( prop, args ); 
} 
} 
}
Javascript 相关文章推荐
Google Map API更新实现用户自定义标注坐标
Jul 29 Javascript
javaScript同意等待代码实现心得
Jan 01 Javascript
jQuery中click事件用法实例
Dec 26 Javascript
基于jQuery+Cookie实现的防止刷新的在线考试倒计时
Jun 19 Javascript
jQuery实现自动与手动切换的滚动新闻特效代码分享
Aug 27 Javascript
jQuery实现的网页左侧在线客服效果代码
Oct 23 Javascript
jQuery四种选择器使用及示例
Jun 05 Javascript
AngularJs表单验证实例代码解析
Nov 29 Javascript
关于bootstrap日期转化,bootstrap-editable的简单使用,bootstrap-fileinput的使用详解
May 12 Javascript
JavaScript实现一个空中避难的小游戏
Jun 06 Javascript
vue.js+Echarts开发图表放大缩小功能实例
Jun 09 Javascript
微信小程序 sha1 实现密码加密实例详解
Jul 06 Javascript
使用原生javascript创建通用表单验证——更锋利的使用dom对象
Sep 13 #Javascript
ie下动态加态js文件的方法
Sep 13 #Javascript
使用Json比用string返回数据更友好,也更面向对象一些
Sep 13 #Javascript
TextArea不支持maxlength的解决办法(jquery)
Sep 13 #Javascript
JQuery与JSon实现的无刷新分页代码
Sep 13 #Javascript
js Event对象的5种坐标
Sep 12 #Javascript
由JavaScript中call()方法引发的对面向对象继承机制call的思考
Sep 12 #Javascript
You might like
用PHP实现Ftp用户的在线管理的代码
2007/03/06 PHP
超级简单的php+mysql留言本源码
2009/11/11 PHP
PHP获取文件相对路径的方法
2015/02/26 PHP
PHP编程快速实现数组去重的方法详解
2017/07/22 PHP
基于ThinkPHP5.0实现图片上传插件
2017/09/25 PHP
jquery必须知道的一些常用特效方法及使用示例(整理)
2013/06/24 Javascript
通过JS来判断页面控件是否获取焦点
2014/01/03 Javascript
jquery+php实现滚动的数字特效
2015/11/29 Javascript
基于JS如何实现类似QQ好友头像hover时显示资料卡的效果(推荐)
2016/06/09 Javascript
Node.js中用D3.js的方法示例
2017/01/16 Javascript
vue元素实现动画过渡效果
2017/07/01 Javascript
Vue.js用法详解
2017/11/13 Javascript
如何选择适合你的JavaScript框架
2017/11/20 Javascript
mongoose更新对象的两种方法示例比较
2017/12/19 Javascript
Vue中使用vee-validate表单验证的方法
2018/05/09 Javascript
图解javascript作用域链
2019/05/27 Javascript
layui实现tab的添加拒绝重复的方法
2019/09/04 Javascript
javascript实现获取中文汉字拼音首字母
2020/05/19 Javascript
Python编程中用close()方法关闭文件的教程
2015/05/24 Python
TensorFlow中权重的随机初始化的方法
2018/02/11 Python
Python 加密与解密小结
2018/12/06 Python
实时获取Python的print输出流方法
2019/01/07 Python
Python 实现子类获取父类的类成员方法
2019/01/11 Python
解决Django生产环境无法加载静态文件问题的解决
2019/04/23 Python
python实现抽奖小程序
2020/04/15 Python
Python算法中的时间复杂度问题
2019/11/19 Python
使用Python进行防病毒免杀解析
2019/12/13 Python
如何把外网python虚拟环境迁移到内网
2020/05/18 Python
Python+MySQL随机试卷及答案生成程序的示例代码
2021/02/01 Python
瑞士最大的图书贸易公司:Orell Füssli
2019/12/28 全球购物
护理专业毕业生推荐信
2013/10/31 职场文书
企业元宵节主持词
2014/03/25 职场文书
《登鹳雀楼》教学反思
2014/04/09 职场文书
建筑安全生产目标责任书
2014/07/23 职场文书
2014年学校党建工作总结
2014/11/11 职场文书
MySQL 数据类型详情
2021/11/11 MySQL