JavaScript加载图片触发onload后width和height仍为0的问题求助

• 事件回调被立即执行：image.onload = imageLoaded(image);写法错误，此处会直接调用imageLoaded函数，而不是将其作为回调绑定到onload事件上，计数器会在图片还没加载完成时就提前减到0，触发load()执行，此时图片自然没有宽高数据。
• 页面加载事件绑定错误：onload = loadAssets();同样是立即执行loadAssets，而非将函数绑定为页面加载完成的回调，属于不规范写法。

const imageURLS = ["lvls/1.png", "assets/tileatlas.png"];
let imageCount = imageURLS.length;
let assets = [];

function imageLoaded(){
    imageCount--;
    if(imageCount == 0){
        window.TILEATLAS = assets[0];
        load();
    }
}

function loadAssets(){
    for(let i = 0, len = imageCount; i < len; i++){
        let image = new Image();
        image.src = imageURLS[i];
        assets.push(image);
        // 直接将函数本身绑定为加载完成回调，触发时才执行
        image.onload = imageLoaded;
    }
}

// 直接赋值函数本身，页面加载完成后才执行资源加载逻辑
window.onload = loadAssets;

• 去掉image.onload赋值时的()和多余参数，直接将imageLoaded函数本身作为回调赋值，保证只有图片加载完成后才会触发计数逻辑
• 去掉window.onload赋值时的()，确保页面加载完成后才启动资源加载流程

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