Promise
Promise.all 简单使用
const reqParams = [
{url: '/abc',params: {page: 10, current: 1}},
{url: '/def',params: {page: 50, current: 20}},
{url: '/ghd',params: {search: 'name', str: '123'}}
]
const api = function(url, params) {
return new Promise((resolve,reject) => {
const xmlhttp = new XMLHttpRequest()
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState==4) {
if (xmlhttp.status==200) {
resolve(xmlhttp.responseText)
} else {
reject(xmlhttp.statusText)
}
}
}
xmlhttp.open('post',url, true)
xmlhttp.send(params)
})
}
const promises = reqParams.map(ele => api(ele.url, ele.params))
Promise.all(promises).then(res => {}).catch(err => {})
Promise 之 eventloop
Promise 中有异步操作
当promse中包含异步操作时,实例的 then/catch 会在下个 eventloop执行,但是promise中的代码会同步执行
console.log(4)
setTimeout(() => {
console.log(5)
},200)
const promise = new Promise((resolve, reject) => {
//这里的代码会 按顺序执行
console.log(1)
setTimeout(resolve, 200, 2)
})
promise.then(res => {
// 这里会在下个 eventloop 执行
console.log(res)
})
console.log(3)
// 上面代码会依次打印 4、1、3、5、2
Promise 中没有异步操作
console.log(4)
setTimeout(() => {
console.log(5)
})
const promise = new Promise((resolve, reject) => {
console.log(1)
resolve(2)
})
promise.then(res => {
console.log(res)
})
console.log(6)
// 上面代码会依次打印 4、1、6、2、5
// 虽然先 运行的 setTimeout,但是 5 是在 下个 eventloop中打印。promise.then 会在同步任务执行完成之后执行
Promise.resolve() & Promise.reject() 的 then/catch 方法也会在本次同步任务执行完成之后执行
reject 方法
Promise 中的 reject 方法
reject 方法,我这里理解 就等同于 throw
const promise1 = new Promise((resolve,reject) => {
reject(1)
})
const promise2 = new Promise((resolve,reject) => {
throw 1
})
async 函数抛出错误
异步函数执行之后,也会返回一个promise,那异步函数如何触发 reject 呢?throw
async function test(){
throw 2
}
test().catch(err => {
console.log(err)
})