如何循環遍歷 JavaScript object 數組？

Question

我正在嘗試遍歷以下內容：

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

我想檢索msgFrom和msgBody

我試過了：

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

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

任何想法我做錯了什么？

Answer 1

看來您可能只是錯過了data的"messages"屬性，因此循環可能會迭代根Object而不是Array ：

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

除非在給定代碼段之前將data設置為messages 。

不過，您應該考慮將其更改為Array的普通for循環：

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

Answer 2

您可以使用 forEach 方法迭代對象數組。

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

參考： https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

Answer 3

在您的腳本中，數據是您的整個對象。

關鍵是“消息”，這是一個您需要像這樣迭代的數組：

    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]);
               }
           }
       }
    }

Answer 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);
 });

Answer 5

要循環遍歷對象數組或僅在 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

Answer 6

迭代次數

方法一： forEach方法

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

---

方法二： for..of方法

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

注意：此方法可能不適用於對象，例如：

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

---

方法二： for..in方法

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

Answer 7

建議的 for 循環非常好，但您必須使用hasOwnProperty檢查屬性。 我寧願建議使用Object.keys()只返回對象的“自己的屬性”（ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys ）

 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]); }); });

Answer 8

要引用包含一個或多個對象的單個數組的內容，即 {messages: [{"a":1,"b":2}] } 括號中的所有內容，只需將 [0] 添加到查詢中獲取第一個數組元素

例如消息[0]將引用該對象{ “一”：1， “B”：2}，而不是僅僅消息，這些消息將引用整個陣列[{ “一”：1， “B”：2}]

從那里您可以將結果作為典型對象使用，並使用 Object.keys 來獲取“a”和“b”。

Answer 9

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);
    }
  }

Answer 10

這是循環遍歷對象（人）中的字段對象的通用方法：

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

人 obj 看起來像這樣：

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

Answer 11

 let data = { "messages": [{ "msgFrom": "13223821242", "msgBody": "Hi there" }, { "msgFrom": "Bill", "msgBody": "Hello;" }] } for ( i = 0. i < data.messages;length. i++ ) { console.log( `Message from ${data.messages[i]:msgFrom}. ${data.messages[i].msgBody}` ) }

Answer 12

let data = {
      "messages": [{
           "msgFrom": "13223821242",
           "msgBody": "Hi there"
       }, 
{
          "msgFrom": "Bill",
          "msgBody": "Hello!"
       }]
 }
 data.messages.forEach((obj, i) => {
     console.log("msgFrom", obj.msgFrom + " msgBody", obj.msgBody);
 });

Answer 13

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;