JavaScript中的遍历方法有哪些?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。
<强>对象遍历
为了便于对象遍历的测试,我在下面定义了一个测试对象obj。
测试对象
//,为,Object 设置三个自定义属性(可枚举)
时间=Object.prototype.userProp & # 39; userProp& # 39;;
时间=Object.prototype.getUserProp 函数(),{
,return Object.prototype.userProp;
};//,定义一个对象,隐式地继承自,Object.prototype
var obj =, {
,名字:& # 39;珀西# 39;
,年龄:21岁
,(符号(& # 39;symbol 属性& # 39;)]:,& # 39;symbolProp& # 39;
,unEnumerable: & # 39;我是一个不可枚举属性& # 39;,
,技能:[& # 39;html # 39;,, & # 39; css # 39;,, & # 39; js # 39;],
,getSkills:函数(),{
return 才能;this.skills;
,}
};//,设置,unEnumerable 属性为不可枚举属性
Object.defineProperty (obj, & # 39; unEnumerable& # 39;,, {
,可列举的:假的
}); ES6之后,共有以下5种方法可以遍历对象的属性。
<强>的…:遍历对象自身的和继承的可枚举属性(不含符号类型的属性)
for (let key obj拷贝),{
,console.log(关键);
,console.log (obj.key);,//wrong 风格
,console.log (obj[主要]);,//right 风格
} 不要使用的…来遍历数组,虽然可以遍历,但是如果为对象。原型设置了可枚举属性后,也会把这些属性遍历到,因为数组也是一种对象。
<强>种(obj) :返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含符号类型的属性)
种(obj);,
(“name"//,,,“age",,“skills",,“getSkills"] <强> Object.getOwnPropertyNames (obj) :返回一个数组,包含对象自身的所有属性(不含符号类型的属性,不包含继承属性,但是包括不可枚举属性)
Object.getOwnPropertyNames (obj);
(“name"//,,,“age",,“unEnumerable",,“skills",,“getSkills"] <强> Object.getOwnPropertySymbols (obj): 强返回一个数组,包含对象自身的所有象征类型的属性(不包括继承的属性)
Object.getOwnPropertySymbols (obj);//,[符号(symbol 属性)] <强> Reflect.ownKeys (obj) :返回一个数组,包含对象自身的所有属性(包含符号类型的属性,还有不可枚举的属性,但是不包括继承的属性)
Reflect.ownKeys (obj);
(“name"//,,,“age",,“unEnumerable",,“skills",,“getSkills",,象征(symbol 属性)] 以上的5种方法遍历对象的属性,都遵守同样的属性遍历的次序规则
<李> 首先遍历所有属性名为数值的属性,按照数字排序
<李> 其次遍历所有属性名为字符串的属性,按照生成时间排序
<李> 最后遍历所有属性名值为象征的属性,按照生成时间排序
如何判断某个属性是不是某个对象自身的属性呢?
用<代码> 操作符(不严谨,它其实判定的是这个属性在不在该对象的原型链上)
& # 39;年龄# 39;,拷贝obj;,,//,真的
& # 39;userProp& # 39;, obj;拷贝,//,true (userProp 是,obj 原型链上的属性)
& # 39;名字# 39;,拷贝对象;,//,true //,上面这个也是,true 的原因是,Object 是一个构造函数,而函数恰巧也有一个,name 属性
Object.name;,,,//, & # 39;对象# 39;
Array.name;,,,//, & # 39;数组# 39; 用<代码> hasOwnProperty() ,这个方法只会检测某个对象上的属性,而不是原型链上的属性。
obj.hasOwnProperty(& # 39;年龄# 39;);,,//,真的
obj.hasOwnProperty(& # 39;技巧# 39;);//,真的
obj.hasOwnProperty (& # 39; userProp& # 39;);,//,假 但是它还是有不足之处的。举例~
//,利用,Object.create(),新建一个对象,并且这个对象没有任何原型链
var obj2 =, Object.create (null,, {
,名字:{,价值:& # 39;珀西# 39;,},
,年龄:{,价值:21,},
,技能:{,价值:[& # 39;html # 39;,, & # 39; css # 39;,, & # 39; js # 39;],}
});
obj2.hasOwnProperty(& # 39;名字# 39;);,//,报错,
obj2.hasOwnProperty(& # 39;技巧# 39;);,//,报错 针对上面的情况,我们用一个更完善的解决方案来解决。
使用Object.prototype.hasOwnProperty.call (obj, & # 39;支持# 39;…)
