JavaScript数学在哪里出了问题？

我试图将“形状”（四个正方形的相对坐标集）转换为像素网格：

var grid_center = 6;
var square_size = 20;

l_shape = {
    coords: [[-1, 0], [0, 0], [1, 0], [-1, 1]]
}

function draw_shape(shape, grid_location) {
    for (coord in shape.coords) {
        trans_coord = (grid_location[0] + coord[0]) * square_size;
        console.log(trans_coord);
    }
}

draw_shape(l_shape, [grid_center - 1, 0]);

预期产出：

100
120
140
160

实际产量：

1000
1020
1040
1060

看起来它可能是自动类型转换的怪异，但我不知道怎么做。我所有的数字都是实际数字，没有一个引用为字符串。手动输入数学时，我得到了预期的结果：

> (5 + 0) * 20
100

从计算机科学的角度来看，也许有更好的方法可以做到这一点，但我对此不感兴趣。我只是想找出上面的程序为什么不能按预期工作。

for（coord in shape.coords）

将索引字符串分配给

coord

您想要

for（coord of shape.coords）

将返回属性索引器。您需要使用

shape.coords[coord]

来访问实际的数值

或者你也可以使用

e、 g

var网格_中心=6；
var平方_尺寸=20；
l_形={
协调：[
[-1, 0],
[0, 0],
[1, 0],
[-1, 1]
]
}
函数绘制形状（形状、网格位置）{
用于（形状上的坐标。坐标）{
trans_-coord=（网格位置[0]+shape.coords[coord][0]）*正方形大小；
控制台日志（trans_coord）；
}
//或
shape.coords.forEach（函数（coord）{
横坐标=（网格位置[0]+坐标[0]）*正方形尺寸；
控制台日志（trans_coord）；
});
}
绘制_形（l_形，[网格_中心-1,0]）这里的迭代方式有点不合适。您使用的方法专门用于：

for…in
语句迭代对象的可枚举属性。。。
如果你看一下
coord
的值，你会发现它们是
'0'
，
'1'
等等。这是因为在JavaScript中，数组是对象，足以让
处理它，但这不是您想要的

您需要的是数组迭代器。如果使用ES6，代码如下所示：

var grid_center = 6;
var square_size = 20;

var l_shape = {
    coords: [[-1, 0], [0, 0], [1, 0], [-1, 1]]
}

function draw_shape(shape, grid_location) {
  shape.coords.forEach(coord => {
    trans_coord = (grid_location[0] + coord[0]) * square_size;
    console.log(trans_coord);
  })
}

draw_shape(l_shape, [grid_center - 1, 0]);

结果不是您所期望的，但您现在走上了正确的轨道。
coord的形状。coords
为
coord
生成字符串值。请花时间研究如何调试JavaScript。@zzzzBov RTFM，嗯？费利克斯·金回答相同，但问题不同。