小白，请教各位大佬！如何利用async、await来改进函数?跪求！

Question

网上找了一段压缩图片的代码，我把它放到单独的helper.js文件里面，但是由于业务逻辑比较负责，所以不希望用原来的回调来实现，因此希望改进为通过async、await这种形式来避免回调的问题，该怎么改进呢？谢谢！代码如下：
exportfunctioncompress(fileObj,callback){
try{
constimage=newImage();
image.src=URL.createObjectURL(fileObj);
image.onload=function(){
constthat=this;
letw=that.width;
leth=that.height;
constscale=w/h;
w=fileObj.width||w;
h=fileObj.height||w/scale;
letquality=0.7;
constcanvas=document.createElement("canvas");
constctx=canvas.getContext("2d");
constanw=document.createAttribute("width");
anw.nodeValue=w;
constanh=document.createAttribute("height");
anh.nodeValue=h;
canvas.setAttributeNode(anw);
canvas.setAttributeNode(anh);
ctx.drawImage(that,0,0,w,h);
if(fileObj.quality&&fileObj.quality<=1&&fileObj.quality>0){
quality=fileObj.quality;
}
constdata=canvas.toDataURL("image/jpeg",quality);
constnewFile=convertBase64UrlToBlob(data);
callback(newFile);//不希望通过此种方式实现
};
}catch(e){
console.log("error!");
}
}
functionconvertBase64UrlToBlob(urlData){
constbytes=window.atob(urlData.split(",")[1]);
constab=newArrayBuffer(bytes.length);
constia=newUint8Array(ab);
for(leti=0;iia[i]=bytes.charCodeAt(i);
}
returnnewBlob([ia],{type:"image/png"});
}
调用的时候，希望可以：
letcompedFile=awaitcompress(fileObj);
//上面代码同步执行完成，再执行下面业务逻辑……

Answer 1

大致思路，先让compress返回Promise对象，然后声明为async，exportasyncfunctioncompress(fileObj){returnnewPromise((resolve,reject)=>{....constnewFile=convertBase64UrlToBlob(data);resolve(newFile);....catch(e){console.log("error!");reject(e);}});}