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 相关文章推荐
js下弹出窗口的变通
Apr 18 Javascript
js实现鼠标拖动图片并兼容IE/FF火狐/谷歌等主流浏览器
Jun 06 Javascript
js返回上一页并刷新的多种实现方法
Feb 26 Javascript
js实现类似于add(1)(2)(3)调用方式的方法
Mar 04 Javascript
深入分析JSON编码格式提交表单数据
Jun 25 Javascript
AngularJS 入门教程之HTML DOM实例详解
Jul 28 Javascript
bootstrap基础知识学习笔记
Nov 02 Javascript
AngularJS使用带属性值的ng-app指令实现自定义模块自动加载的方法
Jan 04 Javascript
AngularJS中scope的绑定策略实例分析
Oct 30 Javascript
React Router v4 入坑指南(小结)
Apr 08 Javascript
9102年webpack4搭建vue项目的方法步骤
Feb 20 Javascript
js重写alert事件(避免alert弹框标题出现网址)
Dec 04 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
一些花式咖啡的配方
2021/03/03 冲泡冲煮
无数据库的详细域名查询程序PHP版(1)
2006/10/09 PHP
聊天室php&mysql(一)
2006/10/09 PHP
php获取指定(访客)IP所有信息(地址、邮政编码、国家、经纬度等)的方法
2015/07/06 PHP
PDO::getAttribute讲解
2019/01/28 PHP
jquery 操作单选框,复选框,下拉列表实现代码
2009/10/27 Javascript
javascript框架设计读书笔记之种子模块
2014/12/02 Javascript
javascript实现全角与半角字符的转换
2015/01/07 Javascript
javascript基本语法
2016/05/31 Javascript
Node.js 8 中的重要新特性
2017/06/28 Javascript
jQuery实现checkbox即点即改批量删除及中间遇到的坑
2017/11/11 jQuery
JavaScript实现数值自动增加动画
2017/12/28 Javascript
angular 用Observable实现异步调用的方法
2018/12/27 Javascript
vue路由守卫+登录态管理实例分析
2019/05/21 Javascript
基于vue和websocket的多人在线聊天室
2020/02/01 Javascript
[36:17]DOTA2上海特级锦标赛 - VGL音乐会全集
2016/03/06 DOTA
Python设计模式之代理模式实例
2014/04/26 Python
Python操作MongoDB数据库的方法示例
2018/01/04 Python
OpenCV-Python实现轮廓检测实例分析
2018/01/05 Python
Python Web编程之WSGI协议简介
2018/07/18 Python
TensorFlow用expand_dim()来增加维度的方法
2018/07/26 Python
详解python爬虫系列之初识爬虫
2019/04/06 Python
基于python cut和qcut的用法及区别详解
2019/11/22 Python
Python对称的二叉树多种思路实现方法
2020/02/28 Python
Python-for循环的内部机制
2020/06/12 Python
用python写一个带有gui界面的密码生成器
2020/11/06 Python
python3.8.3安装教程及环境配置的详细教程(64-bit)
2020/11/28 Python
巴西在线鞋店:Shoestock
2017/10/28 全球购物
Linux常见面试题
2016/10/04 面试题
几个MySql的面试题
2013/04/22 面试题
大学生职业生涯规划方案
2014/01/03 职场文书
教学实验楼管理制度
2014/02/01 职场文书
党章培训心得体会
2014/09/04 职场文书
2015年学习部工作总结范文
2015/03/31 职场文书
倡议书的格式写法
2015/04/28 职场文书
费城故事观后感
2015/06/10 职场文书