如何循环遍历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"
    }
}

当前回答

有几种方法可以做到这一点。。。

1) 两层的。。。循环中。。。

for (let key in validation_messages) {
   const vmKeys = validation_messages[key];
   for (let vmKey in vmKeys) {
      console.log(vmKey + vmKeys[vmKey]);
   }
}

2) 使用Object.key

Object.keys(validation_messages).forEach(key => {
   const vmKeys = validation_messages[key];
   Object.keys(vmKeys).forEach(key => {
    console.log(vmKeys + vmKeys[key]);
   });
});

3) 递归函数

const recursiveObj = obj => {
  for(let key in obj){
    if(!obj.hasOwnProperty(key)) continue;

    if(typeof obj[key] !== 'object'){
      console.log(key + obj[key]);
    } else {
      recursiveObj(obj[key]);
    }
  }
}

并将其称为:

recursiveObj(validation_messages);

其他回答

此答案是本报告中提供的解决方案的汇总发布一些绩效反馈。我想有两个用例和OP没有提到他是否需要访问密钥才能使用它们在循环过程中。

I.需要访问密钥

✔ of和Object.keys方法

let k;
for (k of Object.keys(obj)) {

    /*        k : key
     *   obj[k] : value
     */
}

✔ 进入方法

let k;
for (k in obj) {

    /*        k : key
     *   obj[k] : value
     */
}

小心使用这个,因为它可以打印obj的原型财产

✔ ES7方法

for (const [key, value] of Object.entries(obj)) {

}

然而,在编辑时,我不推荐ES7方法,因为JavaScript在内部初始化了很多变量来构建这个过程(请参阅反馈以获取证据)。除非你不是在开发一个值得优化的大型应用程序,否则这是可以的,但如果优化是你的首要任务,你应该考虑一下。

二、我们只需要访问每个值

✔ of和Object.values方法

let v;
for (v of Object.values(obj)) {

}

关于测试的更多反馈:

缓存Object.keys或Object.values的性能可以忽略不计

例如,

const keys = Object.keys(obj);
let i;
for (i of keys) {
  //
}
// same as
for (i of Object.keys(obj)) {
  //
}

对于Object.values,在Firefox中使用带有缓存变量的本机For循环似乎比使用For循环快一点。。。循环的。然而,区别并不是那么重要,Chrome正在运行。。。比本机for循环快,所以我建议使用for。。。在任何情况下(第4次和第6次测试)处理Object.values时。在Firefox中。。。in循环非常慢,所以当我们想在迭代期间缓存密钥时,最好使用Object.keys。另外,Chrome正在以相同的速度运行这两个结构(第一次和最后一次测试)。

您可以在此处检查测试:https://jsperf.com/es7-and-misc-loops

这个问题

for (var key in validation_messages) {
   var obj = validation_messages[key];
   for (var prop in obj) {
      alert(prop + " = " + obj[prop]);
   }
}

就是您还将循环遍历原始对象的原型。

有了这个,你可以避免:

for (var key in validation_messages) {
   if (validation_messages.hasOwnProperty(key)) {
      var obj = validation_messages[key];
      for (var prop in obj) {
         if (obj.hasOwnProperty(prop)) {
            alert(prop + " = " + obj[prop]);
         }
      }
   }
}

适合我的解决方案如下:

_private.convertParams = function(params){
    var params = [];
    Object.keys(values).forEach(function(key) {
        params.push({"id":key, "option":"Igual", "value":params[key].id})
    });
    return params;
}
for(var k in validation_messages) {
    var o = validation_messages[k];
    do_something_with(o.your_name);
    do_something_else_with(o.your_msg);
}

AgileJon答案的优化和改进版本:

var key, obj, prop, owns = Object.prototype.hasOwnProperty;

for (key in validation_messages ) {

    if (owns.call(validation_messages, key)) {

        obj = validation_messages[key];

        for (prop in obj ) {

            // Using obj.hasOwnProperty might cause you headache if there is
            // obj.hasOwnProperty = function(){return false;}
            // but 'owns' will always work
            if (owns.call(obj, prop)) {
                console.log(prop, "=", obj[prop]);
            }
        }
    }
}