带有对象数组的Javascript范围[重复]

Question

下面这段代码

var test = [
  {region: 'ap', tl: 'lol'},
  {region: 'ew', tl: 'asd'}
];

for(var i in test) {
  console.log(i.region);
}

只显示两次undefined。对象数组有什么问题？

Answer 1

for...in 允许您访问对象的键，但不提供 对值的引用。

这样你就得到了索引（0 和 1）。您可以使用这些索引来访问对象属性。

var test = [
  {region: 'ap', tl: 'lol'},
  {region: 'ew', tl: 'asd'}
];

for(var i in test) {
  console.log(test[i].region);
}

请注意：Array iteration and for...in

for...in 不应用于迭代索引顺序很重要的数组。

你的意思是使用for...of

for...of 语句创建一个循环迭代可迭代对象，包括：内置字符串、数组、类数组对象（例如，参数或 NodeList）、TypedArray、Map、Set 和用户定义的可迭代对象。它调用一个自定义迭代钩子，其中包含要为对象的每个不同属性的值执行的语句。

var test = [
  {region: 'ap', tl: 'lol'},
  {region: 'ew', tl: 'asd'}
];

for(var i of test) {
  console.log(i.region);
}

Answer 2

当您使用for(var i in test) 时，i 将是一个迭代器，这意味着它的值将是0,1,2,...n，其中 n 是数组中最后一个元素的索引。

因此，要解决您的问题，您必须将 i 与 test 数组一起使用

test[i].region

不只是

i.region

var test = [
  {region: 'ap', tl: 'lol'},
  {region: 'ew', tl: 'asd'}
];

for(var i in test) {
  console.log(test[i].region);
}

Answer 3

for...in 用于迭代对象的属性。在这里，例如属性将是 0、1 等。

要遍历数组，请使用for...of

var test = [
  {region: 'ap', tl: 'lol'},
  {region: 'ew', tl: 'asd'}
];

for(var i of test) {
  console.log(i.region);
}

Answer 4

对于数组，您可以使用Array.prototype.forEach()

代码：

const test = [
  {region: 'ap', tl: 'lol'},
  {region: 'ew', tl: 'asd'}
];

test.forEach(i => console.log(i.region));

Answer 5

var test = [
  {region: 'ap', tl: 'lol'},
  {region: 'ew', tl: 'asd'}
];

for(var i in test) {
  console.log(test[i].region);
}