笔记：ES6异步解决方案 promise

promise

语法结构

new Promise((resolve,reject)=>{
	setTimeout(()=>{
    	console.log(1)
        resolve
    },1000)
}).then((res)=>{
	setTimeout(()=>{
    	console.log(2)
    },2000)
})

典型例子

1. 回调地狱

    setTimeout(() => {
      console.log(1)
      setTimeout(() => {
        console.log(2)
        setTimeout(() => {
          console.log(3)
        }, 3000)
      }, 2000)
    }, 1000)

使用promise后

new Promise((resolve, reject) => {
    setTimeout(() => {
    console.log(1)
    resolve()
    }, 1000)
}).then((res) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
        console.log(2)
        resolve()
        }, 2000)
    })
}).then((res) => {
    setTimeout(() => {
    console.log(3)
    }, 3000)
})

PS:一般情况下一个promise里面是一个异步操作

方法

• Promise.all 全部执行完后执行
• Promise.race 其中只要有一个完成后就执行

let p1 = new Promise((resolve,reject)=>{
	setTimeout(()=>{
    	console.log('p1')
        resolve('p1')
    },1000)
})
let p2 = new Promise((resolve,reject)=>{
	setTimeout(()=>{
    	console.log('p2')
        resolve('p2')
    },2000)
})
let p3 = new Promise((resolve,reject)=>{
	setTimeout(()=>{
    	console.log('p3')
        resolve('p3')
    },3000)
})
// 用于如：多图片上传
Promise.all([p1,p2,p3]).then((res)=>{
	console.log("完成")
    console.log(res)
}).catch((err)=>{
	console.log("失败")
    console.log(err)
})
// 常用于请求超时判断
Promise.race([p1,p2,p3]).then((res)=>{
	console.log("部分完成")
    console.log(res)
}).catch((err)=>{
	console.log("失败")
    console.log(err)
})