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)
})
一个前端小白,若文章有错误内容,欢迎大佬指点讨论!