【canvas】导入图片_字体（游戏前置）

【canvas】导入图片/字体（游戏前置）

canvas游戏加载图片需求

1.游戏开始之前必须加载完所有要用的图片/字体(缓存文件数据，方便后面代码同步执行)
2.加载的文件必须精准知道加载结束时间并给出方便后续使用的数据
PS:字体可能在css里需要使用，虽然不必在乎渲染顺序，但是需要渲染出来
音频文件也可以用类似方法预加载（但是因为ios的安全机制所以行不通，但有解决方法）

使用原理

1.浏览器的缓存机制是，只要相同的地址，请求一次后，数据就放入缓存待用
2.用js函数的方式生成dom，预加载图片数据（dom不进行渲染，只是存在缓存中）

使用相关方法

1. new image() 解决图片加载问题
2. async … await … 解决图片加载异步的问题

export default async function(loadArr,progressFn){
    //载入图片
    let num = 0;

    function loadAfter(progressFn){
   
        num++
        progressFn&&progressFn((num/loadArr.length).toFixed(2))
    }

    function loadImg(url,progressFn){
   
        let img = new Image();
        return new Promise((resolve, reject)=>{
   
            img.src = url;
            img.