js中Promise理解与用法

Promise用来干什么?

背景

首先javaScript是单线程语言,有时候为了耗时任务阻塞代码,对这些任务采用异步模式调用。
名词解释:
1、异步: 因为js是单线程的,虽然这样可以降低程序复杂性,但是有时候有多个事件同时执行的需求,这就产生了异步操作,就是异步编程思想
2、耗时任务: 因为js单线程,但一个用js实现的用户交互程序或网站,有些操作要等用户操作,后台监测才执行某项功能程序,就叫耗时任务,就是异步任务
3、异步模式调用: 前一个任务执行完,调用回调函数而不是进行后一个任务。后一个任务不等前一个任务结束就执行,任务调用的顺序和排列顺序不同。
4、回调函数: 把函数当作参数传入另一个函数中,不会立即执行,当需要用这个函数时,再回调运行()这个函数
实现异步和后续处理最开始的方法就是使用回调函数,在耗时任务结束时调用后续操作。

function f1(callback){
    //setTimeout模拟异步任务
    setTimeout(function(){
            console.log("定时器")
            callback()
        },1000) //1s后执行f2()
}
function f2(){
    console.log("我是f2函数")
}

f(f2)

如上把函数f2作为回调函数传入函数f1实现异步操作,1s后才打印内容。但回调方法一旦太过复杂,就会出现问题,出现多重回调的问题。
所以为了更方便地进行异步编程地实现,ES6中实现了promise对象来解决问题。

Promise结构与用法

Promise是一个构造函数

let p = new Promise(function (resolve,reject) { resolve('123')})  //改变状态为成功
           .then(res=>console.log(res+'成功执行'))                //成功执行打印
           .catch(err=>{console.log(err+'失败执行')})
           .finally(()=>{console.log('都会执行');})

1、promise参数是一个函数,这个回调函数有两个形参(自定义,一般约定写为resolve,reject)
2、promise有三种状态pending (等待),pending(成功),rejected (失败),通过参数resolve,reject控制
3、当状态一旦发送改变 就不会重新改变
4、成功执行.then里的回调函数,失败执行.catch内的回调函数

总结:最初创建对象的状态是pending 当调用了 resolve方法时 就会进入 fulfilled 状态 当调用pending 方法 就会进入 rejected 状态

promise链式调用:
.then回调函数实际上是一个新的promise对象,中也可以写两个参数 第二个参数是可选的,

          new Promise((resolve,reject)=>{
            reject(123)
         }).then((res)=>{ console.log(res+'成功1') })
         .then((res)=>{ console.log(res+'成功2') })

当res传入 .then时代表这个新promise对象状态为成功,所以可以接着.then 链式调用

ajax异步编程

//客户端
new Promise(function(resolve, reject){
            const xhr = new XMLHttpRequest();
            xhr.open('POST', '接口路由');
            xhr.send("提交数据");
}).then(res => {
          console.log(res);//打印处理后的数据
      }).catch(err => {
          console.log(err);//打印处理失败的原因
      });
//服务器端
 r1(){
 const body = this.ctx.request.body;//接收数据
 ctx.body = data;//返回数据
 }
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值