Promise对象和async函数
一. Promise对象
// Promise对象通过new关键字生成,有两个参数,成功resolve,失败reject function fun(num) { return new Promise((resolve, reject) => { if (num === 'Hello') { setTimeout(() => { resolve(num + '我成功了') }, 2000) } else { reject('报错error') } }) } fun('Hello').then(res => { console.log(res) }).catch(err => { console.log(err) }) // 通过.then方法调用 let p1 = new Promise((resolve, reject) => { setTimeout(() => { reject('this is where') }, 2000) }) let p2 = new Promise((resolve, reject) => { resolve(p1) }) p2.then(res => { console.log(res) }).catch(err => { console.log(err) })
// 同样Promise对象可以将一个Promise对象的resolve方法作为返回值传给新的Promise,一级一级嵌套传入,但是那样会造成回调地狱,而且代码会非常繁琐冗余,这样我们就需要async函数,他会使异步调用变得非常方便
二. async函数
function p1(name) { return new Promise((resolve, reject) => { setTimeout(() => { resolve(name) }, 2000) }) } function p2(name) { return new Promise((resolve, reject) => { if (name === '小明') { resolve('对的,他就是' + name) } else { reject('不对,他叫' + name) } }) } // async函数的try...catch结构简单点讲就是reslove成功返回值会在try中,catch就是reject错误返回的数据 async function fun() { try { const fun1 = await p1('小明') console.log(fun1) // 小明 备注(第一个异步函数返回的值) const fun2 = await p2(fun1) console.log(fun2) // 对的,他就是小明 备注(成功返回数据) } catch(err) { console.log(err) // 不对,他叫小红 备注(如果第一异步函数传递的参数是小红,返回值也是小红,那么第二个异步函数的参数就是小红并且会抛出reject) } } fun() // 调用async函数 // 另一种方式就是通过return的返回一个Promise对象,通过.then的方式来调用 async function fun() { const fun1 = await p1('小明') return await p2(fun1) } fun().then(res => { console.log(res) // 对的,他就是小明 备注(成功返回数据) }).catch(err => { console.log(err) // 不对,他叫小红 reject抛出的异常 }) // 备注: 当地一个异步函数返回reject时,第二个函数就不会执行,当我们需要第一个返回值就算是reject但是不影响第二个异步函数的执行,就把第一个函数放到try...catch结构中,把第二个放到外边return返回回来