当前位置: 移动技术网 > IT编程>开发语言>JavaScript > 前端面试之---Promise实现多个请求并成功拿到数据后再执行其他异步请求---ES6中的Promise

前端面试之---Promise实现多个请求并成功拿到数据后再执行其他异步请求---ES6中的Promise

2020年07月24日  | 移动技术网IT编程  | 我要评论

面试题content?

最近前端面试真的感觉像在取经一样,不发牢骚了,且谈这几天脑海里有着深刻印象的面试题:

通过ES6的Promise去实现一个请求A和一个请求B,需要判断成功获取数据后才能继续去请求C或者一系列的请求。

此处我说的是请求A和请求B之间异步执行,那么如果请求A和请求B之间是同步执行的关系,可以使用async、await或者Promise.all()和await   ---   后面再去了解一下?

Promise什么东西?

它可以去实现一个异步操作,最常见的应该就是去封装成异步请求了。

Promise对象是一个构造函数,有三种状态表示:

  • pending:初始状态,正在进行时(ing...)
  • resolved(fullfilled):请求成功
  • rejected:请求失败

来一份简单的代码?

// 创建一个req函数,并返回Promise实例对象
let req = function(...) {   // 封装请求可以携带的参数,例如url啥啥的,最好是以对象的形式
    // ...代码

    return new Promise((resolve, reject) => {
        // ...代码,例如你发送请求了
        if(success){   // 请求成功
            resolve(res)
        } else {
            reject(err)
        }
    })
}

// 发送请求
req().then(res => {
    // ...代码   对成功后的数据做相应处理
}).catch(err => {
    // 可以直接打印错误日志或者提示请求失败!
    console.log(err)
})

then方法其实是有两个参数,第一个参数是resolved(请求成功)状态的回调函数,另一个就是rejected(请求失败)状态的回调函数(可选),也就是可以去执行catch回调函数来表示rejected状态。一般来说,我们只需要用catch去写失败的回调函数,或者不写catch都可以

正题来啦!

那么如何实现多个异步请求中又带有同步?

// 来两个promise实例
const pro1 = new Promise((resolve, reject) => {
    // ...代码
})
const pro2 = new Promise((resolve, reject) => {
    // ...代码
})

// 两个pro的状态都为resolved的时候才能执行后面的请求
Promise.all([pro1, pro2]).then((res) => {
    // ...code   执行后面的请求
    console.log(res)
})

Promise.all()

第一个参数是一个可迭代对象,如Array或String,只能当前面所有的对象执行成功后,才能执行成功的回调函数,否则执行失败的回调函数,失败的原因是第一个失败Promise的结果,不会管其他Promise是否完成。

本文地址:https://blog.csdn.net/qq_42001842/article/details/107502361

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网