用for...in 和Object.keys()枚举对象属性的差异

liaoyg8023 发布于2019-08-23 15:59 / 1756人阅读

摘要：用循环和方法都可以获取对象的属性，那么它们有什么区别呢假设有一个对象定义不可枚举属性程序的输出结果为两种方式都获取到了对象的所有可枚举属性，而对于不可枚举属性两种方式都无法得到。

用for...in循环和Object.keys方法都可以获取对象的属性，那么它们有什么区别呢？假设有一个对象a:

var a = {x: 1, y: 2};
Object.defineProperty(a, "z", {value: 3}); // 定义不可枚举属性z
var keys = [];
for (var key in a) {
    keys.push(key);
}
console.log(keys);
console.log(Object.keys(a));

程序的输出结果为：

两种方式都获取到了对象的所有可枚举属性，而对于不可枚举属性两种方式都无法得到。
下面顶一个对象b, 并且b作为对象a的原型对象：

var b = {bx: 1, by: 2};
Object.defineProperty(b, "bz", {value: 3});
Object.setPrototypeOf(a, b);

在此用上面的方式输出a的key值，得到结果如下：

从输出的结果中不难看出，for...in循环可以遍历对象的所有可枚举属性，包括原型对象中的属性，而通过Object.keys只能获取到对象可枚举的自有属性，所以如果想通过for...in获取对象的自有属性，可通过hasOwnProperty方法对结果进行过滤：

var keys = [];
for (var key in a) {
    if (a.hasOwnProperty(key)) {
        keys.push(key);
    }
}

也可以通过Object.getOwnPropertyNames获取对象的自有属性。

从上面的输出结果中可知getOwnPropertyNames方法输出的结果中还包含了对象的不可枚举属性，可以通过Object.propertyIsEnumerable来判断属性是否可枚举从而对结果进行过滤：

混合云服务器托管匹配对象的属性和函数对象的属性 js中集合对象的属性 js包装对象中的属性

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/102607.html

利用Object.keys遍历(forEach/map)对象数组，合并

摘要：中几种遍历对象的方法，包括它们在使用场景方面各有不同。注意它同一样不能保证属性按对象原来的顺序输出。其返回对象的所有自身属性的属性名组成的数组，但不会获取原型链上的属性。另外可以由或终止。在这些情况下，迭代器关闭。 js中几种遍历对象的方法，包括for..of、for..in、Object.keys、Object.getOwnProperty,它们在使用场景方面各有不同。 js对象的属...

浠ラ箍 2019-08-22 16:33 评论0 收藏0
javascript中枚举迭代对象的方法

摘要：像和使用内置构造函数所创建的对象都会继承自和的不可枚举属性，例如的方法或的方法。循环将遍历对象本身的所有可枚举属性，以及对象从其构造函数原型中继承的属性更接近原型链中对象的属性覆盖原型属性。在中，非对象参数被强制转换为对象。 for...in for...in 循环只遍历可枚举属性。像 Array和 Object使用内置构造函数所创建的对象都会继承自Object.prototype和S...

MingjunYang 2019-08-23 16:54 评论0 收藏0
JavaScript：对Object对象的一些常用操作总结

摘要：一可以用作对象的复制可以用作对象的合并注意目标对象自身也会改变。对象四返回一个数组，包括对象自身的不含继承的所有可枚举属性不含属性的键名。该方法返回被冻结的对象。方法判断一个对象是否被冻结。 JavaScript对Object对象的一些常用操作总结。一、Object.assign() 1.可以用作对象的复制 var obj = { a: 1 }; var copy = Object....

马龙驹 2019-08-23 12:46 评论0 收藏0
JavaScript中对象的枚举/遍历（enumeration）

摘要：附如果你想获取一个对象的所有属性甚至包括不可枚举的即可见下面一种方法方法返回一个由指定对象的所有自身属性的属性名包括不可枚举属性但不包括值作为名称的属性组成的数组。 JavaScript中遍历获取对象属性和方法主要有三种： Object.keys()、Object.getOwnPropertyNames()、for...in... 一、Object.keys()、Object.get...

Amio 2019-08-22 17:02 评论0 收藏0
JavaScript对象遍历

摘要：简单说就是一个有一个函数，这个函数执行的返回值一定是一个对象，对象有两个属性标记迭代是否结束，标记这次迭代的结果值。引言遍历对象是平常工作中很常见的一个操作，几乎是日常操作，但是遍历对象真的是一件很容易的事情么，显然不是的。常用的方式 for...in for (variable in object) {...} 这个是一个很常见的用法，相信每个人顺手都可以写出来。但是这里需要主...

Seay 2019-08-26 13:53 评论0 收藏0