JavaScript数组删除索引失效求助：报TypeError错误

你的问题根源出在用delete操作符移除数组元素这一步！delete只会把数组对应位置的元素置为undefined，但不会改变数组长度，也不会重新排列后续元素的索引。这就导致后续随机取索引时，很可能抽到那个被delete过的空位，此时sizes[rnd]是undefined，自然会抛出TypeError: undefined is not an object的错误。

修复后的完整代码 #

var sizes = [ [20, 10, 0], [40, 20, 0], [60, 30, 0], [80, 40, 0], [100, 50, 0] ];
// 补充count变量初始化，原代码未显式处理这部分
var count = 0;

function changeRec() {
    // 增加总次数上限判断，同时保留数组为空的终止条件
    if (sizes.length === 0 || count >= 50) {
        return;
    }
    // 用Math.floor替代Math.round，避免随机索引越界
    var rnd = Math.floor(Math.random() * sizes.length); 
    var x = sizes[rnd][0];
    var y = sizes[rnd][1];
    var element = document.getElementById("rectangle");
    element.style.width = x + "px";
    element.style.height = y + "px";
    var newX = Math.random() * (document.body.clientWidth - 200);
    var rect = element.getBoundingClientRect();
    
    if (Math.abs(newX - rect.left) < 30) {
        changeRec();
    } else {
        element.style.left = newX + "px";
        sizes[rnd][2]++;
        if (sizes[rnd][2] === 10) {
            // 用splice移除对应元素，这是数组删除元素的正确方式
            sizes.splice(rnd, 1);
            console.log("deleted");
        }
        count++;
        calculate(); // 假设此函数已提前定义
    }
}

关键改动说明 #

• 替换delete为splice：splice(rnd, 1)会直接移除数组中索引为rnd的元素，同时自动调整后续元素的索引，彻底避免数组出现undefined空位。
• 优化随机索引生成：Math.floor(Math.random() * sizes.length)能稳定生成0到sizes.length-1之间的整数，避免Math.round可能导致的索引越界问题。
• 补充总次数控制：在函数开头增加count >= 50的判断，确保修改次数不超过上限。
• 完善变量初始化：补充count变量的初始化，避免出现未定义错误。

这样修改后，代码就能正常运行，完全满足你的需求啦！

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