js 关键字 in 的使用方法
2016-07-12 18:27
501 查看
写js的时候需要遍历一个对象的属性,把属性名和属性值都提出来,之前没遇到这种需求,查了一下可以用for in的方式.
数组也可以这样遍历,但不推荐,因为不能保证顺序,而且如果在Array的原型上添加了属性,这个属性也会被遍历出来。
for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为“枚举”。
从技术上将,你可以使用for-in循环数组(因为JavaScript中数组也是对象),但这是不推荐的。因为如果数组对象已被自定义的功能增强,就可能发生逻辑错误。另外,在for-in中,属性列表的顺序(序列)是不能保证的。所以最好数组使用正常的for循环,对象使用for-in循环。
有个很重要的hasOwnProperty()方法,当遍历对象属性的时候可以过滤掉从原型链上下来的属性。
思考下面一段代码:
在这个例子中,我们有一个使用对象字面量定义的名叫man的对象。在man定义完成后的某个地方,在对象原型上增加了一个很有用的名叫 clone()的方法。此原型链是实时的,这就意味着所有的对象自动可以访问新的方法。为了避免枚举man的时候出现clone()方法,你需要应用hasOwnProperty()方法过滤原型属性。如果不做过滤,会导致clone()函数显示出来,在大多数情况下这是不希望出现的。
另外一种使用hasOwnProperty()的形式是取消Object.prototype上的方法。像这样:
其好处在于在man对象重新定义hasOwnProperty情况下避免命名冲突。也避免了长属性查找对象的所有方法,你可以使用局部变量“缓存”它。
严格来说,不使用hasOwnProperty()并不是一个错误。根据任务以及你对代码的自信程度,你可以跳过它以提高些许的循环速度。但是当你对当前对象内容(和其原型链)不确定的时候,添加hasOwnProperty()更加保险些。
--------------------------------------------------------------------------------------------------------------------------------------------------------------
javascript中in关键字还有下面的作用
in操作符用来判断某个属性属于某个对象,可以是对象的直接属性,也可以是通过prototype继承的属性。(参见hasOwnProperty)
对于一般的对象属性需要用字符串指定属性的名称
对于数组属性需要指定数字形式的索引值来表示数组的属性名称(固有属性除外,如length)。
in的右边必须是一个对象,如:你可以指定一个用String构造器生成的,但是不能指定字符串直接量的形式:
如果你使用delete操作符删除了一个属性,再次用in检查时,会返回false,如:
如果你把一个属性值设为undefined,但是没有使用delete操作符,使用in检查,会返回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] + "<br />")
}
输出为:
Java代码
Saab
Volvo
BMW
对象示例:
Js代码
var obj = {
w: "wen",
j: "jian",
b: "bao"
}
for(var v in obj){
document.write(v)+"<br/>";
}
输出为:
Java代码
w
j
b
2.判断对象是否为数组/对象的元素/属性:
格式:(变量 in 对象)......注意,,,
当“对象”为数组时,“变量”指的是数组的“索引”;
当“对象”为对象是,“变量”指的是对象的“属性”。
数组示例:
Js代码
var arr = ["a","b","2","3","str"];
var result = ("b" in arr);
var result1 = (4 in arr);
document.write(result+"<br>");
document.write(result1+"<br>");
输出为:
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)+"<br/>";
document.write(result1)+"<br/>";
输出为:
Java代码
false
true
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] + "<br />")
}
输出为:
Java代码
Saab
Volvo
BMW
对象示例:
Js代码
var obj = {
w: "wen",
j: "jian",
b: "bao"
}
for(var v in obj){
document.write(v)+"<br/>";
}
输出为:
Java代码
w
j
b
2.判断对象是否为数组/对象的元素/属性:
格式:(变量 in 对象)......注意,,,
当“对象”为数组时,“变量”指的是数组的“索引”;
当“对象”为对象是,“变量”指的是对象的“属性”。
数组示例:
Js代码
var arr = ["a","b","2","3","str"];
var result = ("b" in arr);
var result1 = (4 in arr);
document.write(result+"<br>");
document.write(result1+"<br>");
输出为:
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)+"<br/>";
document.write(result1)+"<br/>";
输出为:
Java代码
false
true
相关文章推荐
- 定时跳转
- js 中对象属性的特性
- js最新手机号码、身份证正则表达式
- js 中对象--对象结构(原型链基础解析)
- FastJSON、Gson和Jackson性能对比
- [JS实例] 跟随鼠标移动而发生视差动画的图片
- javascript类型系统——日期Date对象
- javascript中关于日期和时间的基础知识
- Jsp语法
- Javascript表单特效之十大常用原理性样例代码大总结
- jsp引擎是什么?是什么工作原理?
- extjs4.2.1 Ext.encode中文乱码问题
- JS进阶书籍
- JavaScript 事件代理绑定
- javascript 学习基础
- javascript介绍、变量、运算符-1
- qrcode.js插件将你的内容转换成二维码格式
- js概念理解
- js 中对象--属性相关操作
- **JAVASCRIPT** 浏览器对象