如何遍历JavaScript对象中的所有成员,包括作为对象的值 .
例如,我怎么能循环这个(访问每个的“your_name”和“your_message”)?
var validation_messages = {
"key_1": {
"your_name": "jimmy",
"your_msg": "hello world"
},
"key_2": {
"your_name": "billy",
"your_msg": "foo equals bar"
}
}
20 回答
这是AgileJon解决方案的改进和递归版本(demo):
该解决方案适用于各种不同的深度 .
如果你使用递归,你可以返回任何深度的对象属性 -
这个问题
是你还将遍历原始对象的原型 .
有了这个,你会避免它:
在ECMAScript 5下,您可以组合
Object.keys()
和Array.prototype.forEach()
:在ES7中,您可以:
另外一个选项:
对我有用的解决方案如下
我认为值得指出的是,jQuery使用
$.each()
很好地排除了这一点 .见:https://api.jquery.com/each/
例如:
$(this)
是对象内的单个项目 . 如果您没有't want to use jQuery'的选择器引擎,请将$('.foo')
交换为变量 .要遍历JavaScript对象,我们可以使用forEach并优化代码,我们可以使用箭头函数
我无法让上述帖子完全按照我的意思去做 .
在与其他回复一起玩之后,我做了这个 . 这很hacky,但它确实有效!
对于这个对象:
......这段代码:
...在控制台中生成这个:
I.需要访问密钥,
✔ the of and Object.keys approach
✔ the in approach
谨慎使用这个,因为它可以打印
obj
的原型属性✔ the ES7 approach
但是,在编辑时我不建议使用ES7方法,因为JavaScript在内部初始化了很多变量来构建此过程(请参阅反馈以获取证明) . 除非你没有开发一个值得优化的巨大应用程序,否则它可以,但如果优化是你的首要任务,你应该考虑一下 .
二 . 我们只需要访问每个值,
✔ the of and Object.values approach
有关测试的更多反馈:
Object.keys
或Object.values
性能可以忽略不计例如,
对于
Object.values
情况,在Firefox中使用带有缓存变量的原生for
循环似乎比使用for...of
循环要快一些 . 然而,差异并不重要,Chrome运行速度比原始for
循环快for...of
,因此我建议在任何情况下处理Object.values
时使用for...of
(第4和第6次测试) .在Firefox中,
for...in
循环非常慢,因此当我们想要在迭代期间缓存密钥时,最好使用Object.keys
. 此外,Chrome以相同的速度运行两种结构(第一次和最后一次测试) .我知道这已经很晚了,但我花了2分钟来编写AgileJon的优化和改进版本的答案:
在 ES6 中,你可以像这样循环一个对象:(使用arrow function)
jsbin
在 ES7 中,您可以使用Object.entries而不是
Object.keys
并循环遍历如下对象:以上也可以作为 one-liner :
jsbin
如果您想循环遍历嵌套对象,可以使用 recursive 函数(ES6):
jsbin
与上面的函数相同,但使用ES7
Object.entries
而不是Object.keys
:如果您正在进行函数式编程,可以使用
Object.keys
/Object.entries
枚举对象,然后处理这些值,然后使用reduce()
转换回新对象 .ECMAScript-2017,刚刚在一个月前完成,它引入了Object.values() . 所以现在你可以这样做:
使用Underscore.js’s _.each:
在我的情况下(基于前面的)可能有任何数量的级别 .
结果:
p是值
要么