js遍历对象的方法-Toy模板网

这篇具有很好参考价值的文章主要介绍了js遍历对象的方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

遍历对象的方法

一、for...in

二、Object.keys()

三、Object.getOwnPropertyNames()

一、for...in

for in循环是最基础的遍历对象的方式，它还会得到对象原型链上的属性

//对象
var obj = {
     name: 'Lina',
     sex: 'boy',
     age: '18',
     height: '185',
   }

for (let i in obj) {
     console.log(i, obj[i])  //i是键名，obj[i]是键值
 }

 //数组
var arr = ['Lina', 'boy', '18', '185']

 for (let i in arr) {
     console.log(i, arr[i])  //i是index，arr[i]是item
 }

二、Object.keys()

Object.keys()是ES5新增的一个对象方法，该方法返回对象自身属性名组成的数组，他会自动过滤掉原型链上的属性，然后可以通过数组的forEach()方法来遍历。

var obj = {
       name: 'Lina',
       sex: 'boy',
       age: '18',
       height: '185',
   }

for (let item of Object.keys(obj)) {
    console.log(item)
} // 遍历返回键名

for (let item of Object.values(obj)) {
    console.log(item)
} // 遍历返回键值

for (let item of Object.entries(obj)) {
    console.log(item)
}  // 返回键值对组成的数组，如：['key', 'value']

三、Object.getOwnPropertyNames()

也是ES5新增的一个对象方法，该方法返回对象自身属性名组成的数组，包括不可枚举的属性，也可以通过数组的forEach()方法来遍历。

var obj = {
       name: 'Lina',
       sex: 'boy',
       age: '18',
       height: '185',
   }

Object.getOwnPropertyNames(obj).forEach(key => {
     console.log(key, obj[key])
 })

只有 for in 循环会得到对象原型链上的属性，其它方法都只适用于对象自身的属性ES 语言后续添加的新特性不会对以前的代码产生副作用，比如在 ES2015 之前就存在的 for in 循环。

Object.keys() 和 Object.getOwnPropertyNames() 是肯定不会返回 Symbol 属性的。

Object.getOwnPropertyNames() 和 Object.getOwnPropertySymbols() 互补，一个得到普通属性，一个得到 Symbol 属性，都包括不可枚举的属性。

除此之外还有：Object.getOwnPropertySymbols()、Reflect.ownKeys等，详细讲解见JS遍历对象的几种方法_这片林子好大的博客-CSDN博客_js对象遍历（如有侵权请联系删除）文章来源地址https://www.toymoban.com/news/detail-563055.html

到了这里，关于js遍历对象的方法的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！