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

相关推荐
前端码农一枚几秒前
前端打包性能优化全攻略
前端
Roc.Chang1 分钟前
终极指南:解决 Vue 项目中 “regenerator-runtime/runtime“ 缺失报错
前端·javascript·vue.js·webpack·前端工程
AAA阿giao2 分钟前
从树到楼梯:数据结构与算法的奇妙旅程
前端·javascript·数据结构·学习·算法·力扣·
BD_Marathon6 分钟前
Vue3组件(SFC)拼接页面
前端·javascript·vue.js
wregjru7 分钟前
【C++】2.3 二叉搜索树的实现(附代码)
开发语言·前端·javascript
Hao_Harrision7 分钟前
50天50个小项目 (React19 + Tailwindcss V4) ✨ | StickyNavbar(粘性导航栏)
前端·typescript·react·tailwindcss·vite7
IT古董11 分钟前
企业级官网全栈(React·Next.js·Tailwind·Axios·Headless UI·RHF·i18n)实战教程-前言
javascript·react.js·ui
LYFlied12 分钟前
前端性能优化常见面试问题汇总
前端·面试·性能优化
柒.梧.13 分钟前
Java核心面试题终极总结:从基础到进阶,覆盖高频考
java·开发语言·面试
不爱学习的老登14 分钟前
基于CodeServer打造一个属于自己的 LaTeX Web 编辑器
前端·编辑器