自己对Promise的简单理解

  • js是单线程的,就是指一次只能完成一件任务。如果有多个任务时就必须排队。前面一个任务完成,在执行后面一个任务,以此类推。
  • 同步模式:就是排队执行任务,后一个任务等待前一个任务完成后,再继续向下执行。
  • 异步模式:每一个任务有一个或是多个回调函数,前一个任务结束后,不是执行后一个任务,而是执行回调函数,后一个任务则是不等前一个任务结束就执行。所以,程序的执行顺序与任务的排列顺序是不一致的、异步的。
  • promise:最大的好处是在异步执行的流程中,把执行代码和处理结果的代码清晰的分离了。
promise在创建时,会先执行自己里面的内容
    function initPromise(){
        return new Promise((resolve,reject) => {
        // 在这里会先执行其中的代码
            if(true){ 
            log('异步操作成功,会先打印出来')
            resolve('成功时返回出来的内容')
            }else{
            log('异步操作失败,也是会先打印');
            reject('失败是会返回出来的内容')       
            }
        })
    };
    initPromise().then((success)=>{
    // 这个success参数,接受的就是成功时调用的resolve中的内容
        log('success')打印的为'成功时返回出来的内容'
    }).catch((error)=>{ 
    // 这个error参数,接受的是失败时调用reject中的内容
        log(error)打印的为'失败是会返回出来的内容'
        })
  • 链式调用:resolve中返回的内容将作为下一个then函数接受的参数。他是按顺序执行的
  • promise.all():方法用于将多个promise实例,包装成一个新的promise实例,他是并行执行的。
    例子:例如一个页面的聊天系统,我们需要从两个不同的URL分别获得用户的个人信息和好友列表,这两个任务是可以并行执行的。用`promise.all()`实现
    // 获取聊天系统中的用户信息
    let message = new Promise((resolve,reject) => {
    // resolve中的内容会传给下面调用的then函数
    resolve(
        // 调用后台获取数据,并将数组return出去
        getData().then(res => {
            const result = res.data;
            return result ;
        })
        )
    });
    // 获取好友列表
    let person = new Promise((resolve,reject) => {
        resolve(
            // 调用后台获取数据,并将数组return出去
        getData().then(res => {
            const result = res.data;
            return result ;
        })
        )
    })
    使用`Promise.all()`并行处理事件,他会等待最慢获取数据的那个接口处理完毕后,将多个接口获取到的数据,以`数组`的形式返回。
    all(中的参数)就是同时调用接口的函数名,result就是不同接口获取的数据,以数组显示
    Promise.all([message,person]).then(result => {
        log(result)
    })
  • promise中的resolve用法
    写法一:需要返回值的写法,会有返回值
    function promise(){
        return new Promise((resolve,reject) => {
            resolve(
               getData().then(res => {
                    const result = res.data;
                    return result.data;
                    })
        )
    })
    }
    写法二:不用返回值,即使不用返回值,也学要写`resolve()`
    function promise(){
        return new Promise((resolve,reject) => {
              getData().then(res => {
              // 调用后台的接口获取数据,并在这里执行一些逻辑
                    const result = res.data;
                    resolve()
                    })
    })
    }
    调用这个函数,`写法一`是需要有返回值时这样写,`写法二`只是调用完这个接口后再去操作其他的逻辑。
    首先会先执行`promise`函数中的逻辑,当执行完这个函数之后,如果成功了。才回执行`then`中的逻辑代码。通常这样写就是顺序的问题,这样会先得到想要的数据,再去进行逻辑操作。
    promise().then(result => {
    // 根据需要些result参数
        log(result)
      })
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值