Promise对象

promise对象是一种异步编程解决方案,Promise是一个容器,保存着将来才会执行的代码;从语法角度来说Promise是一个对象,可以用来获取异步操作的消息。异步操作,同步解决,避免了层层嵌套的回调函数,可以链式调用降低了操作难度。

### 实例化
    Promise构造函数接收一个函数作为参数,也就是回调函数;该函数的两个参数分别是resolve和reject。resolve作为成功的回调函数,reject作为失败的回调函数。Promise对象代表一个异步操作有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。最后返回resolved(已定型)结果。
### 2.实例方法
    定义在Promise.prototype中的方法,通过Promise实例可以直接调用
    then(res=>{}) 状态由pending变为fulfilled的时候也就是异步操作成功之后执行该回调函数
        参数:回调函数,回调函数的参数为resolve函数传递过来的值
        返回值:返回一个新的Promise实例对象,因此可以使用链式调用
    catch(err=>{}) 由pending变为rejected的时候执行该回调函数也就是异步失败之后执行该回调函数
        参数:回调函数,回调函数的参数为reject函数传递过来的值
        返回值:返回一个新的Promise实例对象,因此可以使用链式调用
    finally()无论异步操作执行成功失败与否,都会执行该回调
        参数:回调函数
        返回值:返回一个新的Promise实例对象

 // 1.创建promise对象
        let p1=new Promise((resolve,reject)=>{
            // resolve,reject是回调函数
            // resolve函数是promise对象最终状态为成功状态
            //reject函数是promise对象最终状态为失败状态
            
            //非异步
            //假设异步操作执行成功,修改promise对象状态为成功状态
            if(3>2){
                resolve('success')
            }else{
                //假设异步操作执行失败,修改promise对象状态为失败状态
                reject('error')
            }
        })
        //如何提供resolve和reject函数
       //在promise原型里有then和catch
        // 1.then方法表示的是成功之后的回调,对应resolve
        // 2.catch方法表示的是失败之后的回调,对应reject
         p1.then((res)=>{
            console.log(res,'成功回调')
        }).catch((error)=>{
            console.log(error,'失败回调')
        }).finally(()=>{
            console.log('最终执行')
        })
		//如果then里面传了两个回调函数,第一个代表成功之后的回调,第二个代表失败之后的回调,分别代表resolve()和reject()
		p1.then((res)=>{
            console.log(res,'成功')
        },(err)=>{
            console.log(res,'失败')
        });
//考虑到可能有多个请求需要发送,需要创建多个承诺对象,所以采用工厂函数进行封装
function promise(url) {
			return new Promise((resolve, reject) => {
				let xhr = new XMLHttpRequest();
				xhr.open('get', url);
				xhr.send();
				xhr.onreadystatechange = function () {
					if (xhr.readyState === 4) {
						if (xhr.status === 200) {
							resolve(xhr.responseText)
						} else {
							reject(xhr.responseText)
						}
					}
				}
			})
		}
    let p1=getPromise('http://121.199.0.35:8888/index/article/findCategoryArticles');
    let p2=getPromise('http://121.199.0.35:8888/index/carousel/findAll');
    // p1.then((res)=>{
    //     console.log(res,'1111111')
    // })
    // p2.then((res)=>{
    //     console.log(res,'222222')
    // })
    // all 只有两个异步操作请求都成功才会返回成功的结果,否则返回失败对象
    // race 谁的响应先拿到用谁的结果 无论成功与否
    //any 有成功用成功的,都失败就失败
    let p=Promise.any([p1,p2]);
    p.then((res)=>{
        console.log(res)
    }).catch((err)=>{
        console.log(err)
    })

  • 11
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值