访问数组中的映射对象与循环/循环中的访问之间的差异

Difference between access to mapped objects in array through for cycle/for in cycle

本文关键字：循环 访问 之间 对象 数组 映射      更新时间：2023-09-26

我一直在使用 D3.js 库，遇到了这个未知的行为。我使用范围函数创建了包含 100 个从 0 到 99 的数字的数组，然后将函数映射到数组的每个成员，如下所示：

var data = d3.range(100).map(function() {
    return {
        x: 0,
        y: 0
    };
})

在Mozilla文档中关于javascript的是这个map函数行为描述：

创建一个新数组，其中包含在此数组中的每个元素上调用提供的函数的结果。

我的

预期是，在执行此代码后，我的变量数据将是一个包含 100 个对象的数组，每个对象的属性 x 和 y 设置为 0。

我尝试使用两种不同的方法访问这些对象。起初，我尝试像这样使用 for/in 循环：

for(d in data){
  console.log(d);
  console.log(d.x + " " + d.y);
}

这个周期的产出是：

0
undefined undefined
1
undefined undefined
...
99
undefined undefined

然后我尝试使用这样的循环通过索引访问每个对象

for(var i = 0; i < data.length; i++){
    console.log(data[i]);
    console.log(data[i].x + " " + data[i].y);
}
突然之间，

输出完全不同，查找并匹配所有对象及其属性：

[object Object]
0 0
[object Object]
0 0
...
[object Object]
0 0

我不明白为什么通过 for/in 循环访问数组中的对象不起作用，但直接索引访问是成功的。我想我可能错过了一些关于映射函数如何将函数结果映射到原始数组的内容，或者对于/在周期内对数组的访问与通过索引不同。有谁知道为什么会这样？谢谢。

for..in遍历数组索引，而不是值：

> a = [100,200,300]
[100, 200, 300]
> for(d in a) console.log(d)
0
1
2

因此，在第一个循环中，您将需要：

for(d in data)
    console.log(data[d].x + " " + data[d].y);
正如

你所说， 

var data = d3.range(100).map(function() {
    return {
        x: 0,
        y: 0
    };
})

创建一个新数组，其中包含在此数组中的每个元素上调用提供的函数的结果。

for in 可用于对象而不是数组。

对于数组，您需要使用 for 循环。

你可以按照这个

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in
相关文章：