【场景应用题】用Promise实现图片的异步加载

直接上代码:

javascript 复制代码
let imageAsync = (url) => {
    return new Promise((resolve, reject) => {
        let image = new Image();
        image.src = url;
        image.onload = () => {
            console.log('图片加载完成');
            resolve(image)
        }
        image.onerror = () => {
            console.log('图片加载失败');
            reject(new Error('图片加载失败'))
        }
    })
}
imageAsync('url').then(() => {
    console.log('图片加载成功')
}).catch(error => {
    console.log('图片加载失败')
})

总结:考察的点主要是Promise的使用结合Image图片的使用。

相关推荐
蓝婷儿5 分钟前
第二章支线八 ·CSS终式:Tailwind与原子风暴
前端·css
vanora111128 分钟前
Vue在线预览excel、word、ppt等格式数据。
前端·javascript·vue.js
树上有只程序猿31 分钟前
低代码不是炫技,而是回归需求的必然答案
前端
比特森林探险记35 分钟前
Go 中 map 的双值检测写法详解
java·前端·golang
溪饱鱼36 分钟前
React源码阅读-fiber核心构建原理
前端·javascript·react.js
陈随易1 小时前
Element Plus 2.10.0 重磅发布!新增Splitter组件
前端·后端·程序员
陈随易1 小时前
2025年100个产品计划之第11个(哆啦工具箱) - 像哆啦A梦口袋一样丰富的工具箱
前端·后端·程序员
xiaogg36781 小时前
网站首页菜单顶部下拉上下布局以及可关闭标签页实现vue+elementui
javascript·vue.js·elementui
胡gh1 小时前
JS面向对象程序设计(OOP)与原型机制,到底是如何一步步走向实用的
javascript
前端缘梦1 小时前
微信小程序登录方案实践-从账号体系到用户信息存储
前端·微信小程序