如何遍历数组中对象的tipo属性并提取其值？

你用for...in出错的原因很明确：for...in是用来遍历对象的键名的，当用它遍历数组时，拿到的其实是数组的索引（字符串类型的"0"、"1"这类值），如果直接把索引和数组元素拼接，就会出现0[object Object]这种不符合预期的输出——本质是字符串索引和对象做了强制拼接。

下面是几种正确获取所有tipo属性值的方法：

方法一：用for...of遍历（最直观） #

for...of专门用来遍历数组这类可迭代对象的元素，直接拿到数组里的每个对象：

const tipoValues = [];
for (const product of productsArray) {
  tipoValues.push(product.tipo);
}
console.log(tipoValues); // 输出所有tipo属性值组成的数组

方法二：用forEach遍历 #

数组自带的forEach方法可以直接遍历每个元素：

const tipoValues = [];
productsArray.forEach(product => {
  tipoValues.push(product.tipo);
});

方法三：用map方法（最简洁） #

map方法专门用来将数组转换为另一个数组，一行代码就能搞定需求：

const tipoValues = productsArray.map(product => product.tipo);

方法四：非要用for...in的话（不推荐） #

如果一定要用for...in，需要通过索引拿到对应对象，还要过滤掉原型链上的属性：

const tipoValues = [];
for (const index in productsArray) {
  // 确保只处理数组自身的索引，避免遍历到原型链上的额外属性
  if (productsArray.hasOwnProperty(index)) {
    const product = productsArray[index];
    tipoValues.push(product.tipo);
  }
}

内容的提问来源于stack exchange，提问作者Daniel Sanchez Islas