js 关键字 in 的使用方法

　　写js的时候需要遍历一个对象的属性，把属性名和属性值都提出来，之前没遇到这种需求，查了一下可以用for in的方式.

var obj = {

"key1":"value1",

"key2":"value2",

"key3":"value3"

};

function EnumaKey(){

for(var key in obj ){

alert(key);

}

function EnumaVal(){

for(var key in obj ){

alert(obj[key]);

}

数组也可以这样遍历，但不推荐，因为不能保证顺序，而且如果在Array的原型上添加了属性，这个属性也会被遍历出来。

for-in循环应该用在非数组对象的遍历上，使用for-in进行循环也被称为“枚举”。

从技术上将，你可以使用for-in循环数组（因为JavaScript中数组也是对象），但这是不推荐的。因为如果数组对象已被自定义的功能增强，就可能发生逻辑错误。另外，在for-in中，属性列表的顺序（序列）是不能保证的。所以最好数组使用正常的for循环，对象使用for-in循环。

有个很重要的hasOwnProperty()方法，当遍历对象属性的时候可以过滤掉从原型链上下来的属性。

思考下面一段代码：

// 对象
var man = {hands: 2,legs: 2,heads: 1
};// 在代码的某个地方
// 一个方法添加给了所有对象
if (typeof Object.prototype.clone === "undefined") {Object.prototype.clone = function () {};
}

在这个例子中，我们有一个使用对象字面量定义的名叫man的对象。在man定义完成后的某个地方，在对象原型上增加了一个很有用的名叫 clone()的方法。此原型链是实时的，这就意味着所有的对象自动可以访问新的方法。为了避免枚举man的时候出现clone()方法，你需要应用hasOwnProperty()方法过滤原型属性。如果不做过滤，会导致clone()函数显示出来，在大多数情况下这是不希望出现的。

// 1.
// for-in 循环
for (var i in man) {if (man.hasOwnProperty(i)) { // 过滤console.log(i, ":", man[i]);}
}
/* 控制台显示结果
hands : 2
legs : 2
heads : 1
*/// 2.
// 反面例子:
// for-in loop without checking hasOwnProperty()
for (var i in man) {console.log(i, ":", man[i]);
}
/*
控制台显示结果
hands : 2
legs : 2
heads : 1
clone: function()
*/

另外一种使用hasOwnProperty()的形式是取消Object.prototype上的方法。像这样：

for (var i in man) {if (Object.prototype.hasOwnProperty.call(man, i)) { // 过滤console.log(i, ":", man[i]);}
}

其好处在于在man对象重新定义hasOwnProperty情况下避免命名冲突。也避免了长属性查找对象的所有方法，你可以使用局部变量“缓存”它。

var i, hasOwn = Object.prototype.hasOwnProperty;
for (i in man) {if (hasOwn.call(man, i)) { // 过滤console.log(i, ":", man[i]);}
}

严格来说，不使用hasOwnProperty()并不是一个错误。根据任务以及你对代码的自信程度，你可以跳过它以提高些许的循环速度。但是当你对当前对象内容（和其原型链）不确定的时候，添加hasOwnProperty()更加保险些。

--------------------------------------------------------------------------------------------------------------------------------------------------------------

javascript中in关键字还有下面的作用

定义：

in操作符用来判断某个属性属于某个对象，可以是对象的直接属性，也可以是通过prototype继承的属性。(参见hasOwnProperty)

注意事项：

对于一般的对象属性需要用字符串指定属性的名称

如：

var mycar = {make: "Honda", model: "Accord", year: 1998};

"make" in mycar  // returns true

"model" in mycar // returns true

对于数组属性需要指定数字形式的索引值来表示数组的属性名称（固有属性除外，如length）。

// Arrays

var trees = new Array("redwood", "bay", "cedar", "oak", "maple");

0 in trees        // returns true

3 in trees        // returns true

6 in trees        // returns false

"bay" in trees    // returns false (you must specify the index number,

                  // not the value at that index)

"length" in trees // returns true (length is an Array property)

in的右边必须是一个对象，如：你可以指定一个用String构造器生成的，但是不能指定字符串直接量的形式：

var color1 = new String("green");

"length" in color1 // returns true

var color2 = "coral";

"length" in color2 // generates an error (color is not a String object)

如果你使用delete操作符删除了一个属性，再次用in检查时，会返回false，如：

var mycar = {make: "Honda", model: "Accord", year: 1998};

delete mycar.make;

"make" in mycar;  // returns false

var trees = new Array("redwood", "bay", "cedar", "oak", "maple");

delete trees[3];

3 in trees; // returns false

如果你把一个属性值设为undefined，但是没有使用delete操作符，使用in检查，会返回true.

var mycar = {make: "Honda", model: "Accord", year: 1998};

mycar.make = undefined;

"make" in mycar;  // returns true

var trees = new Array("redwood", "bay", "cedar", "oak", "maple");

trees[3] = undefined;

3 in trees; // returns true

1.For...In 声明用于对数组或者对象的属性进行循环/迭代操作。

　　对于数组，迭代出来的是数组元 素，对于对象，迭代出来的是对象的属性；

Js代码

var x
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"
for (x in mycars)
{
document.write(mycars[x] + " ")
}

输出为：

Java代码

Saab
Volvo
BMW

对象示例：

Js代码

var obj = {
w: "wen",
j: "jian",
b: "bao"
}
for(var v in obj){
document.write(v)+" ";
}

输出为：

Java代码

2.判断对象是否为数组/对象的元素/属性：

格式：（变量 in 对象）......注意，，，

　　当“对象”为数组时，“变量”指的是数组的“索引”；

　　当“对象”为对象是，“变量”指的是对象的“属性”。

数组示例：

Js代码

var arr = ["a","b","2","3","str"];
var result = ("b" in arr);
var result1 = (4 in arr);
document.write(result+" ");
document.write(result1+" ");

输出为：

Java代码

false
true

对象示例：

Js代码

var obj={
w:"wen",
j:"jian",
b:"bao"
}
var result=(2 in obj);
var result1=("j" in obj);
document.write(result)+" ";
document.write(result1)+" ";

输出为：

Java代码

false
true

js 关键字 in 的使用方法相关推荐

swfobject.js 2.2简单使用方法
swfobject.js 2.2简单使用方法官方网址介绍 http://code.google.com/p/swfobject/wiki/documentation 用法: html部分 <d ...
JSPatch实现原理详解：让JS调用/替换任意OC方法
JSPatch实现原理详解:让JS调用/替换任意OC方法 2015-07-10 09:05 编辑: suiling 分类:iOS开发来源:bang JSPatch以小巧的体积做到了让JS调用/替换任 ...
iOS与JS交互的4种方法
iOS与JS交互的方法: 1.拦截url(适用于UIWebView和WKWebView) 2.JavaScriptCore(只适用于UIWebView,iOS7+) 3.WKScriptMessage ...
c js html页面进度条,js实现进度条的方法
本文实例讲述了js实现进度条的方法.分享给大家供大家参考.具体实现方法如下: 1.setTimeout和clearTimeout 进度条 .container{ width:450px; border ...
js中match、replace方法中使用正则表达式
为什么80%的码农都做不了架构师?>>> js中match.replace方法中使用正则表达式 (2012-06-29 14:23:37) 转载▼ 标签: 字符串飞雪正则表 ...
[转]Asp.net 将js文件打包进dll 方法
Asp.net 将js文件打包进dll 方法注:本文基于.NET 2.0 和 VS2005 我们在编写 Server Control 的时候难免要用到一些客户端脚本(javascript),如何把脚 ...
.NET 调用JS：WebBrowser.Document.InvokeScript 方法抛出“指定的转换无效”异常的原因
.NET 调用JS:WebBrowser.Document.InvokeScript 方法抛出"指定的转换无效"异常的原因参考文章: (1).NET 调用JS:WebBrowse ...
SpringMVC 静态资源CSS，JS访问不了解决方法
SpringMVC 静态资源CSS,JS访问不了解决方法参考文章: (1)SpringMVC 静态资源CSS,JS访问不了解决方法 (2)https://www.cnblogs.com/peiy ...
原生js实现preAll和nextAll方法
一直以来都在好奇,jquery的prevAll和nextAll方法都是咋实现的,那么厉害,而且还那么方便.不得不说,jquery真的帮我们省去了开发中手写大量js代码带来的开发进度问题,而且很好的解决 ...

js 关键字 in 的使用方法

定义：

注意事项：

js 关键字 in 的使用方法相关推荐

最新文章

热门文章