如何在外部调用async函数里的数据

我代码是一个函数,里面有个for循环,完了在一个if判断是否有图片,之后在if里获取图片的高,之后把图片的高度加到总高度上,因为用到了onload,所以写了个async语句把if里的东西包裹了起来,但是我在async外面调用总高度依旧是没有添加图片高度

                   async function getImgHeight() {
                        const img = new Image()
                        img.src = answer_img[0].src
                        await new Promise(resolve => {
                            img.onload = async function () {
                                img_number--
                                img_height += img.height
                                answer_height += img.height
                            }
                        })
                    }
                    getImgHeight()
                    console.log(answer_height,img_height)

我这个console出来的总高度为没有添加图片高度,图片高度img—height为在for循环外面初始化的0,想问问这个该如何解决呢

阅读 2.4k
1 个回答
                   async function getImgHeight() {
                        const img = new Image()
                        img.src = answer_img[0].src
                        await new Promise(resolve => {
                            img.onload = async function () {
                                img_number--
                                img_height += img.height
                                answer_height += img.height
                            }
                        })
                    }
                    await getImgHeight()
                    console.log(answer_height,img_height)

这样做是因为 JS 不允许穿越时空,加载图片这事就像煮鸡蛋,你不能一下锅就捞出来,所以你得 await
并且 await 是一个全新的功能,在没有这种功能之前,你只能把鸡蛋下锅的同时,在上面贴一个便利贴,提醒之后的自己,要拿熟鸡蛋干什么。

赫拉克特利的名言“人不能两次踏进同一条河流”,说的是世易时移,人物两非的道理。在旧版 JS 里,这是一个真理:取鸡蛋出锅的你,和放鸡蛋下锅的你,已经不是同一个人了——这意味着放鸡蛋的人永远不可能拿到自己煮的熟鸡蛋。
好在新的 JS 对此做了修正:你可以创建一个名为“ async 函数体”的时空领域,使用 await 之咒把播种时的自己连同整个领域一并冻结,等到瓜熟蒂落时候再醒来,继续享用亲手种下的果实。

注意 await 之咒只在 async 函数体和全局 async 环境下使用,且只能冻结其所在的函数体,对这个函数体外的时空而言,冻结的时空是一个遥遥无期的承诺,终其一生也看不到承诺兑现之日——除非把外面的时空也冻结了。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题