javascript - 自动递增JS对象数组

我有些困惑，可能正在忽略某些东西。
基本上我有一个JS对象数组：

var defaults = {
    pointers : {
        pointer1 : {
            top : '0px',
            left : '75px',
        },
        pointer2 : {
            top : '310px',
            left : '170px',
        },
        pointer3 : {
            top : '50px',
            left : '80px'
        },
        pointer4 : {
            top : '0px',
            left : '130px',
        },
        pointer5 : {
            top : '310px',
            left : '205px',
        },
        pointer6 : {
            top : '50px',
            left : '90px'
        }
    }
};

如果我手动调用它们以将其添加到类<li>的pointer-circle中，则可以正常工作：

$('.pointer-circle:eq(1)').css({
    top : defaults.pointers.pointer1.top,
    left : defaults.pointers.pointer1.left
});

但是与其手动输出每个指针，不如希望它们经过for循环：

var i = 1;
for (i in defaults.pointers) {
    $('.pointer-circle:eq(' + i + ')').css({
        top : defaults.pointers.pointer[i].top,
        left : defaults.pointers.pointer[i].left
    });
}

这是行不通的。在控制台日志中，我收到此错误：


  未捕获的TypeError：无法读取未定义的属性'pointer1'


任何帮助是极大的赞赏。

最佳答案

这就是你要的：

var counter = 0;
for (i in defaults.pointers) {
    $('.pointer-circle:eq(' + counter + ')').css({
        top : defaults.pointers[i].top,
        left : defaults.pointers[i].left
    });
    counter++;
}

（另请参见this Fiddle）