【场景应用题】用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图片的使用。

相关推荐
回忆2012初秋18 小时前
【Nginx】优雅地走进高性能 Web 服务器世界(1)
服务器·前端·nginx
kyriewen18 小时前
Claude Code Token 烧太快?实测 5 招,把月费从 250 美金砍到 50 美金
前端·ai编程·claude
weixin_5231853218 小时前
Java面试高频题:Integer缓存机制与 equals、== 区别
java·缓存·面试
weixin_3947580319 小时前
CRMEB Pro 商品字段二开:为什么加一个字段会牵动 SKU、缓存和前端展示?
前端·缓存
IT_陈寒19 小时前
Python的pickle让我半夜加班,这破玩意儿太坑了
前端·人工智能·后端
qq_4221525719 小时前
图片格式转换工具怎么选?JPEG、PNG、WebP、AVIF 格式对比与在线转换方案实测
前端
xiaofeichaichai20 小时前
ES 新特性九年速览:从 ES2016 到 ES2024
前端·javascript·es6
2401_8346369920 小时前
Keepalived + LVS (DR) + Nginx + NFS 高可用 Web 集群部署实战手册
前端·nginx·lvs
和你看星星20 小时前
我把代码排查流程做成了一个 Codex Skill
前端
excel20 小时前
AI 冲击下的前端发展指引:从工具到价值的重塑
前端