ES6考点 —— Promise

最新推荐文章于 2025-05-21 17:23:59 发布

zhanghuali2019

最新推荐文章于 2025-05-21 17:23:59 发布

阅读量230

点赞数

CC 4.0 BY-SA版权

分类专栏： ES6

本文链接：https://blog.youkuaiyun.com/zhanghuali0210/article/details/82220891

ES6 专栏收录该内容

16 篇文章

订阅专栏

博客介绍了ES6出现是为取代Callback Hell，还对相关问题进行解答。阐述了Promise语法，如new Promise要传入含resolve和reject参数的函数，成功执行resolve()，失败执行reject()，并用then监听。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、Callback Hell

ES6的出现就是为了取代Callback Hell。

CallBack Hell:

function loadImg(src, callback, fail) {
    var img = document.createElement('img')
    img.onload = function() {
        callback(img)
    }
    img.onerror = function() {
        fail()
    }
    img.src = src
}
var src = 'http://www.imoooc.com/static/img/index/logo_new.png'
loadImg(src, function(img){
    console.log(img.width)
}, function() {
    console.log('failed')
})

promise:

function loadImg(src) {
    const promise = new Promise(function (resolve, reject) {
        var img = document.createElement('img')
        img.onload = function() {
            resolve(img)
        }
        img.onerror = function() {
            reject()
        }
        img.src = src
    })
    return promise
}
var src = 'http://www.imoooc.com/static/img/index/logo_new.png'
var result = loadImg(src)

result.then(function(img) {
    console.log(img.width)
}, function() {
    console.log('failed')
})
result.then(function(img) {
    console.log(img.height)
})

二、问题解答

语法：