Javascript循环通过对象数组?

时间:2013-10-22 22:18:40

标签: javascript

我试图循环使用以下内容:

{
    "messages": [{
        "msgFrom": "13223821242",
        "msgBody": "Hi there"
    }, {
        "msgFrom": "Bill",
        "msgBody": "Hello!"
    }]
}

我想要检索msgFrommsgBody

我试过了:

        for (var key in data) {
           var obj = data[key];
           for (var prop in obj) {
              if(obj.hasOwnProperty(prop)){
                console.log(prop + " = " + obj[prop]);
              }
           }
        }

但是控制台日志会打印[Object]

任何想法我做错了什么?

11 个答案:

答案 0 :(得分:83)

看起来您可能错过了"messages"中的data属性,因此循环可能会迭代根Object而不是Array

for (var key in data.messages) {
    var obj = data.messages[key];
    // ...
}

除非在给定代码段之前将data设置为messages

但是,您应该考虑将其更改为for的正常Array循环:

for (var i = 0, l = data.messages.length; i < l; i++) {
    var obj = data.messages[i];
    // ...
}

答案 1 :(得分:12)

在您的脚本中,数据就是您的整个对象。

key是“messages”,这是一个你需要迭代的数组,如下所示:

    for (var key in data) {
       var arr = data[key];
       for( var i = 0; i < arr.length; i++ ) {
           var obj = arr[ i ];
           for (var prop in obj) {
               if(obj.hasOwnProperty(prop)){
                   console.log(prop + " = " + obj[prop]);
               }
           }
       }
    }

答案 2 :(得分:10)

您可以使用forEach方法迭代对象数组。

data.messages.forEach(function(message){
    console.log(message)
});

参见: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

答案 3 :(得分:4)

此处提供的所有答案均使用正常功能,但如今,我们的大多数代码在ES6中均使用箭头功能。希望我的回答对我们在对象数组上进行迭代时如何使用箭头功能有帮助

let data = {
      "messages": [{
           "msgFrom": "13223821242",
           "msgBody": "Hi there"
       }, {
          "msgFrom": "Bill",
          "msgBody": "Hello!"
       }]
 }

使用箭头函数在数组上执行.forEach

 data.messages.forEach((obj, i) => {
     console.log("msgFrom", obj.msgFrom);
     console.log("msgBody", obj.msgBody);
 });

使用箭头功能在数组上执行.map

 data.messages.map((obj, i) => {
     console.log("msgFrom", obj.msgFrom);
     console.log("msgBody", obj.msgBody);
 });

答案 4 :(得分:2)

建议的for循环非常好,但您必须使用hasOwnProperty检查属性。我建议使用Object.keys()只返回自己的属性&#39;对象(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

&#13;
&#13;
var data = {
    "messages": [{
        "msgFrom": "13223821242",
        "msgBody": "Hi there"
    }, {
        "msgFrom": "Bill",
        "msgBody": "Hello!"
    }]
};

data.messages.forEach(function(message, index) {
    console.log('message index '+ index);
    Object.keys(message).forEach(function(prop) {    
        console.log(prop + " = " + message[prop]);
    });
});
&#13;
&#13;
&#13;

答案 5 :(得分:1)

要在javascript中循环访问对象数组或只是数组,您可以执行以下操作:

var cars = [{name: 'Audi'}, {name: 'BMW'}, {name: 'Ferrari'}, {name: 'Mercedes'}, {name: 'Maserati'}];

for(var i = 0; i < cars.length; i++) {
    console.log(cars[i].name);
}

还有forEach()函数,它更“javascript-ish”,代码也更少,但语法更复杂:

cars.forEach(function (car) {
    console.log(car.name);
});

他们两人都在输出以下内容:

// Audi
// BMW
// Ferrari
// Mercedes
// Maserati

答案 6 :(得分:0)

引用包含一个或多个对象的单个数组的内容,即括号内的所有内容 {messages:[{“a”:1,“b”:2}]},只需在查询中添加[0]即可获得第一个数组元素

e.g。 消息[0] 将引用对象{“a”:1,“b”:2} 而不只是消息,它将引用整个数组[{“a”:1,“b”:2}]

从那里你可以将结果作为典型对象使用,并使用Object.keys来获得“a”和“b”。

答案 7 :(得分:0)

迭代

方法1: forEach方法

messages.forEach(function(message) {
   console.log(message);
}

方法2: for..of方法

for(let message of messages){
   console.log(message);
}

注意:此方法可能不适用于对象,例如:

let obj = { a: 'foo', b: { c: 'bar', d: 'daz' }, e: 'qux' }

方法2: for..in方法

for(let key in messages){
       console.log(messages[key]);
 }

答案 8 :(得分:0)

for (let key in data) {
    let value = data[key];
    for (i = 0; i < value.length; i++) {
      console.log(value[i].msgFrom);
      console.log(value[i].msgBody);
    }
  }

答案 9 :(得分:0)

这是在对象(人)中遍历字段对象的通用方法:

for (var property in person) {
    console.log(property,":",person[property]);
}

人obj看起来像这样:

var person={
    first_name:"johnny",
    last_name: "johnson",
    phone:"703-3424-1111"
};

答案 10 :(得分:0)

    arr = [{food:"Mandazi", Price: 5},{food:"Black Tea", Price: 20},{food:"Black Coffee", Price: 20}
    ];
    txt = "";
    for (i = 0; i ";
    }
    document.getElementById("show").innerHTML = txt;