码迷,mamicode.com
首页 > 其他好文 > 详细

promise用法解析

时间:2021-02-01 12:48:56      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:erro   error   return   end   err   选择   异步   定义   ESS   

Promise的理解

  • Promise是对异步操作的一种解决方案,一般情况下,如果有异步操作,就需要使用Promise对这个异步操作进行封装
  • 使用Promise后可以使代码看起来更加优雅并且易于维护

使用定时器模拟一个异步请求

  • Promise接收一个函数作为参数,而这个函数又接收两个参数,这两个参数分别为resolve和reject
    • resolve在异步操作被成功执行时调用,而reject在异步操作执行失败时调用
    • resolve和reject都是一个函数,它们都接收网络请求传过来的数据
    • 对这个数据的具体操作分别放在then()和catch()中执行
new Promise((resolve, reject) => {
    setTimeout(() => {
        // 成功时调用resolve     
        resolve(‘你好‘)
         //失败时调用reject
        reject(‘error message‘)
    }, 1000)
}).then((data) => {
    console.log(data) //你好
}).catch((err) => {
    console.log(err)
})
  • 传入catch中的函数可以在then中同时定义
new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve(‘你好‘)
        reject(‘error message‘)
    }, 1000)
}).then((data) => {
    console.log(data)
}, (err) => {
    console.log(err)
})

Promise的三种状态

  • pending:等待状态
    • 比如正在进行网络请求,或者定时器还没到时间
  • fulfill:满足状态
    • 当我们主动调用resolve()时,就处于该状态,此时回调then
  • reject:拒绝状态
    • 当我们主要调用reject()时,就处于该状态,此时回调catch

Promise的链式调用

  • 同时执行多个异步操作,在then()方法内部返回new Promise((resolve) => {resolve(res + ‘111‘)})
  • new Promise((resolve) => {resolve(res + ‘111‘)}) 可简写成Promise.resolve(res + ‘111‘)
    • Promise.resolve(res + ‘111‘) 还可以进一步简写为res + ‘111‘
new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve(‘aaa‘)
    }, 1000)
}).then(res => {
    console.log(res, ‘第一层的10行代码‘)
    // return new Promise((resolve) => {resolve(res + ‘111‘)})
    return res + ‘111‘
}).then(res => {
    console.log(res, ‘第二层的10行代码‘)
    return Promise.reject(‘err message‘)
}).then(res => {
    console.log(res, ‘第三层的10行代码‘)
}).catch(err => {
    console.log(err)
})

Promise中的all方法

  • 如果想同时接收到几个异步操作的数据,可以选择调用Promise的all方法,将需要执行的异步操作放入all()方法中执行
  • all()方法接收一个数组,then()方法接收的也是一个数组
Promise.all([new Promise(resolve => {
        setTimeout(() => {
            resolve(‘result1‘)
        }, 2000)
    }),
    new Promise(resolve => {
        setTimeout(() => {
            resolve(‘result2‘)
        }, 1000)
    })
]).then(results => {
    console.log(results[0], results[1])
})

promise用法解析

标签:erro   error   return   end   err   选择   异步   定义   ESS   

原文地址:https://www.cnblogs.com/jincanyu/p/14352650.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!