如何在JavaScript中实现异步倒计时？解决数组未定义报错

一、解决"Cannot read properties of undefined (reading '5')"报错 #

这个报错说明plateau[14]是undefined，核心原因有三个：

• hauteur值不足：数组索引从0开始，要访问第14行（索引14），hauteur必须至少为15，否则plateau的长度不够，plateau[14]不存在。检查你定义的hauteur变量值，确保它≥15。
• air()执行时机错误：如果air()在initPlateau()之前调用，此时plateau还没被初始化，自然取不到对应元素。必须保证initPlateau()先执行完毕，再调用air()，比如：

initPlateau();
air();

• 变量作用域问题：确保plateau是全局变量或者两个函数都能访问到的变量，在代码最外层声明：

let plateau;
let hauteur = 15; // 示例值，根据你的需求调整
let largeur = 10; // 示例值，根据你的需求调整

二、修复倒计时逻辑错误 #

当前代码里每次设置innerHTML都是固定的29，不会递减，而且间隔是1秒不是你要的3.75秒，修改如下：

function air(){
    let timer;
    let barre_oxygene = 6;
    let count = 30; // 初始化计数器
    const ele = plateau[14][5];
    
    // 先渲染初始值
    ele.innerHTML = count;
    
    timer = setInterval(()=>{
        count--;
        ele.innerHTML = count;
        
        // 倒计时到0时清除定时器
        if(count === 0){
            clearInterval(timer);
            // 这里可以添加倒计时结束的逻辑，比如触发氧气耗尽提示
        }

        // 后续氧气条功能可在此扩展，示例：每5次倒计时减少1格氧气
        if(count % 5 === 0 && barre_oxygene > 0){
            barre_oxygene--;
            // 更新氧气条DOM的逻辑，比如改变宽度
            // document.getElementById('oxygen-bar').style.width = `${barre_oxygene * 16.67}%`;
        }
    }, 3750); // 3.75秒 = 3750毫秒
}

注：去掉了async，因为这里不需要异步操作，setInterval本身就是异步定时器。

三、额外检查点 #

• 确认initPlateau()里的largeur值≥6，这样plateau[14][5]的列索引5才有效（列索引从0开始，需要largeur≥6）。
• 检查页面DOM结构，确保存在id="contenu"的元素，否则initPlateau()无法创建表格。

内容的提问来源于stack exchange，提问作者Personne Bélial