ES6 | Promise静态方法

89 阅读2分钟

Offer 驾到,掘友接招!我正在参与2022春招打卡活动,点击查看活动详情

ES系列文章

Promise.resolve方法

Promise.resolve方法可以.then调用是因为当前的实例是一个promise对象。可以用promise.resolve方法去创建一个对象

let p1 = Promise.resolve('success')
// console.log(p1)
p1.then(res => {
    console.log(res)
})

Promise.reject方法

reject方法类似于resolve方法,只是会将Promise对象的状态设置为reject状态。

let p2 = Promise.reject('fail')
console.log(p2)
p2.catch(err => {
    console.log(err)
})

Promise.reject传入的参数无论是什么形态,都会直接作为reject状态的参数传递到catch的。

应用场景

function foo(flag) {
    if (flag) {
        return new Promise(resolve => {
            // 异步操作
            resolve('success')
        })
    } else {
        // return 'fail'
        return Promise.reject('fail')
    }
}

foo(false).then(res => {
    console.log(res)
}, err => {
    console.log(err)
})

Promise.all方法

Promise.all方法用于将多个Promise实例,包装成一个新的Promise实例

let p1 = new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log(1)
        resolve('1成功')
    }, 2000)
})
let p2 = new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log(2)
        // resolve('2成功')
        reject('2失败')
    }, 1000)
})
let p3 = new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log(3)
        resolve('3成功')
    }, 3000)
})
Promise.all([p1, p2, p3]).then(res => {
    console.log(res)
}, err => {
    console.log(err)
})

Promise.race方法

Promise.race方法同样是将多个Promise实例,包装成一个新的Promise实例。 那么可以使用race方法:prace是竞技、竞赛的意思,表示多个Promise相互竞争,谁先有结果,那么就使用谁的结果;

Promise.race([p1, p2, p3]).then(res => {
    console.log(res)
}, err => {
    console.log(err)
})

应用场景

//Promise.all方法
const imgArr = ['1.jpg', '2.jpg', '3.jpg']
let promiseArr = []
imgArr.forEach(item => {
    promiseArr.push(new Promise((resolve, reject) => {
        // 图片上传的操作
        resolve()
    }))
})
Promise.all(promiseArr).then(res => {
    // 插入数据库的操作
    console.log('图片全部上传完成')
})
//Promise.race方法
function getImg() {
    return new Promise((resolve, reject) => {
        let img = new Image()
        img.onload = function () {
            resolve(img)
        }
        // img.src = 'http://www.xxx.com/xx.jpg'
        img.src = 'https://www.imooc.com/static/img/index/logo.png'
    })
}

function timeout() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            reject('图片请求超时')
        }, 2000)
    })
}

Promise.race([getImg(), timeout()]).then(res => {
    console.log(res)
}).catch(err => {
    console.log(err)
})

一个前端小白,若文章有错误内容,欢迎大佬指点讨论!