如何循环访问 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]

知道我做错了什么吗?

330419 次浏览

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

关键字是“ message”,这是一个数组,您需要像下面这样迭代:

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

看起来你可能错过了 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];
// ...
}

可以使用 forEvery 方法对对象数组进行迭代。

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

参考: Https://developer.mozilla.org/en-us/docs/web/javascript/reference/global_objects/array/foreach

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

例如,信息[0]将引用对象{“ a”: 1,“ b”: 2} 而不是仅仅引用整个数组[{“ a”: 1,“ b”: 2}]的 信息

从那里,您可以将结果作为典型的对象处理,并使用 Object.key 来获取“ a”和“ b”。

建议的 for 循环非常好,但是您必须使用 hasOwnProperty检查属性。我建议使用 Object.keys(),它只返回对象的‘ own properties’(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]);
});
});

要循环遍历 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);
}

还有 为每个()函数,它更像 javascript,代码也更少,但语法更复杂:

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

他们都输出了以下数据:

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

迭代

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

这里提供的所有答案都使用普通函数,但是现在我们的大多数代码都在 ES6中使用箭头函数。我希望我的回答可以帮助读者在对对象数组进行迭代时如何使用箭头函数

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

使用箭头函数对数组执行 Do.forEach 操作

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

使用箭头函数在数组上映射

 data.messages.map((obj, i) => {
console.log("msgFrom", obj.msgFrom);
console.log("msgBody", obj.msgBody);
});
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);
}
}

下面是循环访问对象(人)中的字段对象的一般方法:

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

Obj 看起来是这样的:

var person={
first_name:"johnny",
last_name: "johnson",
phone:"703-3424-1111"
};
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;

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

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