🔥关于对象的遍历，你掌握了多少？不同场景用什么方法？前言对象的遍历（1）for…in（推荐） for…in循环遍历

这是我参与8月更文挑战的第14天，活动详情查看：8月更文挑战

说明:文章部分内容及图片出自网络，如有侵权请与我本人联系(主页有公众号:小攻城狮学前端)

作者：小只前端攻城狮、主页：小只前端攻城狮的主页、来源：掘金

GitHub：P-J27、 CSDN：PJ想做前端攻城狮

著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

前言

最近有点文荒，刚好最近在业务需求上遇到一点关于对象遍历上的，专门去看了看，也刚好总结一篇专门关于对象遍历的几种方式和区别的文章出来，顺便在巩固一下。

对象的遍历

截止到目前，ES6现在提供了 5 种主流的方法来帮助我们遍历对象的属性。我就一一介绍一下。

（1）for…in（`推荐`）

for…in循环遍历对象自身的和继承的可枚举属性（不含 Symbol 属性）。

var obj = {'0':'a','1':'b','2':'c'};
for(let i in obj) {
     console.log(i,":",obj[i]);
}

（2）Object.keys/values(obj)（`推荐`）

Object.keys返回一个数组，包括对象自身的（不含继承的）所有可枚举属性（不含 Symbol 属性）的键名。Object.values和Object.keys的区区别就像的for..in和for..of的区别一样。一个拿的是key，一个拿的是value。

var obj = {'0':'a','1':'b','2':'c'};
Object.keys(obj).forEach(function(key){
     console.log(key,obj[key]);
});

（3）Object.getOwnPropertyNames(obj)

Object.getOwnPropertyNames返回一个数组，包含对象自身的所有属性（不含 Symbol 属性，但是包括不可枚举属性）的键名。

var obj = {'0':'a','1':'b','2':'c'};
Object.getOwnPropertyNames(obj).forEach(function(key){
    console.log(key,obj[key]);
});

（4）Object.getOwnPropertySymbols(obj)

Object.getOwnPropertySymbols返回一个数组，包含对象自身的所有 Symbol 属性的键名。getOwnPropertySymbols和Object.getOwnPropertyNames的区别从名字也都看出来了就不多说了，平时应用的也比较少。

（5）Reflect.ownKeys(obj)

Reflect.ownKeys返回一个数组，包含对象自身的（不含继承的）所有键名，不管键名是 Symbol 或字符串，也不管是不是可枚举。

var obj = {'0':'a','1':'b','2':'c'};

Reflect.ownKeys(obj).forEach(function(key){
console.log(key,obj[key]);
});

遍历顺序

对象的遍历，不像简单的数组遍历，按照索引值的顺序，以上的 5 种方法遍历对象的键名，都遵守同样的属性遍历的次序规则。

首先遍历所有数值键，按照数值升序排列。

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

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

小结

关于五种方法的一些区别总结如下。

方法	返回值	继承	不可枚举类型	Symbo类型	推荐
for..in	无	包含	不包含	不包含	`推荐`
Object.keys/values	数组	不包含	不包含	不包含	`推荐`
Object.getOwnPropertyNames	数组	不包含	包含	不包含	`推荐`
Object.getOwnPropertySymbols	数组	/	/	包含	视情况
Reflect.ownKeys(obj)	数组	包含	包含	包含	视情况

一般来说，for..in就足够应对大多数场景了，语义化就业较强。

感谢阅读，希望能对你有所帮助,文章若有错误或者侵权，可以在评论区留言或在我的主页添加公众号联系我。

写作不易，如果觉得不错，可以「点赞」+「评论」谢谢支持❤

🔥关于对象的遍历，你掌握了多少？不同场景用什么方法？

前言