【前端面试】JS对象属性的遍历问题

一、概述

两个因素会影响对象属性的遍历：

（1）对象属性的属性描述符 (property descriptor) 的 [[Enumerable]] 特性为 true （可枚举）才能被 for-in 访问；

（2）如果在对象本身没有找到属性，接下来会在原型链上查找，访问属性时会沿着整个原型链从下到上查找属性。

二、遍历

（1）遍历可枚举的、自身的属性：

① Object.keys()

Object.keys() 返回可枚举、自身的属性，再用for..of对返回的数组进行遍历。

注： Object.keys() 的使用环境是 ES5+

② for..in + hasOwnProperty()

for..in得到可枚举、自身+继承的属性，再用hasOwnProperty()过滤继承属性

（2）遍历所有（可枚举的&不可枚举的）、自身的属性：

使用 Object.getOwnPropertyNames()

（3）遍历可枚举的、自身+继承的属性：

使用 for..in

（4）遍历所有的、自身+继承的属性

三、总结

（1）利用for...in循环遍历属性；

——循环对象自身的属性，对象继承来的属性，不会遍历不可枚举的属性，不会遍历Symbol属性。

（2）利用Object.keys(obj)、Object.values(Obj)、**Object.entries(Obj)**遍历属性；

——只能返回对象自身的可遍历属性键名，无法返回对象通过继承获取来的属性键名。

（3）利用**Object.getOwnPropertyName(Obj)**遍历属性；

——返回一个数组，返回对象自身所有的除了Symbol属性之外的所有属性（包括不可枚举的属性）的键名。

（4）利用**Object.getOwnPropertySymbols(Obj)**遍历属性；

——返回一个数组，包含对象自身所有Symbol属性键名。

（5）利用**Relect.ownKeys(obj)**遍历属性；

——返回一个数组，包含对象自身所有属性，无论键名是否是Symbol，也不管属性是否可枚举。

以上的5中方法，在遍历对象键名的时候，都遵循同样的遍历次序，规则如下：

首先，遍历所有数值键，按照从小到大的顺序排列；

其次，遍历所以字符串键，按照加入时间顺序，升序排列；

最后，遍历所有Symbol键，按照时间顺序，升序排列。

推荐博客：

（1）JavaScript 中遍历对象的属性

（2）for in 循环遍历对象时需要注意的事项

（3）对象属性的遍历（一）遍历对象基础的三个API

转载于:https://juejin.im/post/5b82064251882542f50471f4