Javascript 对象[key]返回未定义（奇怪）

我在一个物体上有一种奇怪的行为

var canvas = document.createElement('canvas');
canvas.style.display = 'none';
document.body.appendChild(canvas);

var ctx = canvas.getContext('2d');
//imgObj is an Image Object
ctx.drawImage(imgObj, 0, 0);

//inserting(caching) the image data in the spriteData object
var spriteCoordinates = coordinates.spriteCoordinates; 
//coordinates.spriteCoordinates has keys in integer

for(var i in spriteCoordinates){
    var x = spriteCoordinates[i].x,
        y = spriteCoordinates[i].y,
        w = spriteCoordinates[i].w,
        h = spriteCoordinates[i].h;

    var imageData = ctx.getImageData(x, y, w, h);

    spriteData[i] = imageData;
}

当I console.log

spriteData

时，我得到：

Object { }

当我点击它时，我得到：

0: {
    width: int,
    height: int,
    data: array()
}// I've put int and array just for representation

但是当我使用console.log

spriteData[0]

（

spriteData['0']

）时，我得到了

未定义的
。
我甚至尝试了console.log
Object.keys（spriteData）
，但我得到了一个空数组

有人能告诉我发生了什么事吗

编辑

经过一些操作后，当我将此函数放入
Image
对象的
onload
方法时，我发现这是原因。但在它之外，对象是正常的。
在
循环中，使用更具语义的：


Object.keys（spriteCoordinates）.map（fn）
-获取由
spriteCoordinates
对象的键组成的数组，并将其转换为数组
fn
是一个函数，
.map（）
将迭代数组，对每个项应用函数，并根据结果构造一个新数组

结果是一个新数组，您可以直接将其分配给spriteData。
是
坐标。spriteCoordinates
是数组吗？尝试将您的
替换为。。。在带有常规for循环的
中（如果是），运行

for。。。在中，在数组上运行可能会导致非常奇怪的行为。@GNi33不，这是一个以整数为键的对象。你能在JSFIDLE上列出一个意外行为的简短示例吗？@Phylogenesis，我在jsbin上尝试过使用控制台，但我不知道为什么jsbin中的getImageData出现错误。谢谢。这是一种分配值的更简单（编写起来也更少）的方法。但我发现了问题。。。但还是不知道为什么会有这种行为。

var spriteData = Object.keys(spriteCoordinates).map(function(key) {
    var item = spriteCoordinates[key];
    return ctx.getImageData(item.x, item.y, item.w, item.h);
});