push的内容为for循环最后的结果

Question

var date = [{
    "align": "left",
    "width": 170,
    "fixed": true
}, {
    "align": "left",
    "width": 160,
    "fixed": true
}, {
    "align": "right",
    "width": 110,
    "fixed": true
}, {
    "align": "right",
    "width": 110,
    "fixed": true
},{
    "name": "09时",
    "property": "h9",
    "align": "right",
    "width": 80,
    "fixed": false
}
           ]
var data = {};
for(var i =0; i<24;i++){
    if(i<10){
        data.name = "0" + i + "时";
    } else{
        data.name = i + "时";
    }
    data.property = "h" + i;
    data.align = "right";
    data.width =80;
    date.push(data);
}
console.log(date)

运行结果：

理想状态应该是打印24个小时。但是添加的都是循环的最后结果，是我有哪里搞错了吗？

Answer 1

你在for循环的时候并没有每次对data对象都初始化，即data = {};导致for循环添加的都是同一个对象的引用地址。对象是引用类型，for循环结束后，数组中
的所有data对象指向的都是i = 23那一轮的赋值对象。改正如下：
var data;
for(var i =0; i<24;i++){
data = {};
if(i<10){
data.name = "0" + i + "时";
} else{
data.name = i + "时";
}
data.property = "h" + i;
data.align = "right";
data.width =80;
date.push(data);
}