Angular app中FOR循环的意外行为

Question

这很可能是一个愚蠢的错误,但我看不出这个问题.我正在尝试在Angularjs应用程序中为图库创建一个对象数组.每张照片对象有一个thumb和img属性.该for循环创建对象细,我每次登录到控制台进行检查:

{thumb: "/10000/0_t.jpg", img: "/10000/0_l.jpg"}
{thumb: "/10000/1_t.jpg", img: "/10000/1_l.jpg"}
{thumb: "/10000/2_t.jpg", img: "/10000/2_l.jpg"}
...

但是,运行此代码后:

var images = [];
var image = {};
for (var i = 0; i < property.images.length; i++) {
    image.thumb = "/" + property.id + "/" + i + "_t.jpg";
    image.img = "/" + property.id + "/" + i + "_l.jpg";
    console.log(image); //this gives expected output
    images.push(image);
};
console.log(images); //this gives all entries as the same

决赛console.log给了我:

{thumb: "/10000/27_t.jpg", img: "/10000/27_l.jpg"} //X28

对于每个图像.27来自这样一个事实,即有28个图像,但我无法理解为什么它们都有相同的路径？

Answer 1

您需要在每次迭代时创建一个新对象:

var image;
for (var i = 0; i < property.images.length; i++) {
    image = {};
    image.thumb = "/" + property.id + "/" + i + "_t.jpg";
    image.img = "/" + property.id + "/" + i + "_l.jpg";
    console.log(image); //this gives expected output
    images.push(image);
};

如果不这样做,那么每次迭代都将重用相同的原始对象.传递对象.push()不会复制.