JavaScript循环中出现Cannot set property 'hours' of undefined错误求助

首先咱们来拆解一下你遇到的错误根源：

• 当外层循环第一次执行（i=0）时，你只往tabulatorRowData.projectData数组里push了1个对象，此时数组长度为1，只有索引0的位置有有效值。
• 但内层循环直接遍历j=0到j=9，当j>=1时，tabulatorRowData.projectData[j]是undefined，自然无法给它的hours和progress属性赋值，这就是报错的原因。
• 另外还有一个隐藏问题：你现在每次push的都是同一个mainColumnHeading对象引用，就算解决了索引问题，最后数组里的所有元素都会指向同一个对象，修改其中一个会影响全部，这肯定不是你想要的结果。

修复后的代码 #

var tabulatorRowData = {};
var projectData = [];
tabulatorRowData.projectData = projectData;

// 外层循环生成10条项目数据
for (let i = 0; i < 10; i++) {
    // 关键：每次循环创建新的对象实例，避免引用复用
    const mainColumnHeading = {
        id: 1,
        projectID: 2,
        projectName: "project Name"
    };
    tabulatorRowData.projectData.push(mainColumnHeading);
    
    // 直接操作当前刚添加的数组元素（索引为i）
    tabulatorRowData.projectData[i].hours = i;
    tabulatorRowData.projectData[i].progress = i + 20;
}

console.log(tabulatorRowData);
console.log(JSON.stringify(tabulatorRowData));

核心修复点 #

1. 避免对象引用复用：把mainColumnHeading的声明放到外层循环内部，这样每次循环都会生成一个全新的对象，数组里的每个元素都是独立的。
2. 修正数组索引访问：不再用固定的0-9遍历j，而是直接使用外层循环的i作为索引——因为每次push后，数组的最后一个元素就是索引i的位置，这样不会出现访问不存在元素的情况。

如果你原本的需求是给每个项目添加多条小时/进度数据，那可以调整内层循环的逻辑，比如先push项目对象，再给该对象添加子数组存储多组数据，但从你的报错场景来看，上面的代码应该能完美解决问题。

内容的提问来源于stack exchange，提问作者user6743474