zoukankan      html  css  js  c++  java
  • 浅谈angular中的promise

    promise目的就是为了跳出回调地狱.老掉牙的东西,大神轻拍.

    举个最简单的例子:请求数据(getData),解析数据(executeData),显示数据(showData).

            //获取数据
            function getData(callback){
                callback && callback();
            }
    
            //解析数据
            function executeData(callback){
                callback && callback();
            }
    
            //显示数据
            function showData(callback){
                callback && callback();
            }
    
            //开始请求数据了
            getData(function(){
                executeData(function(){
                    showData(function(){
                        console.log("data showed");
                    })
                })
            })

    传统做法就是这样,当然也可以通过事件机制实现。事件机制相比于回调,回调是一对一,事件机制就是一对多。但是,缺点就是代码极难阅读,尤其是混淆了复杂的业务逻辑,写代码注释都很难补救。

    这时候promise出场了.

    //获取数据
            function getData(){
                var deferred = $q.defer();//创建一个延迟
                //do something
                setTimeout(function(){
                    deferred.resolve();  //延迟执行完毕,没问题啊
                },1000);
                return deferred.promise;//返回promise,我给你个承诺,你等着
            }
    
            //解析数据
            function executeData(type){
                var deferred = $q.defer();
                //do something
                setTimeout(function(){
                    deferred.reject();//出事了,数据不对
                },1000);
                return deferred.promise;
            }
    
            //显示数据
            function showData(){
                var deferred = $q.defer();
                //do something
                deferred.notify();//持续发送消息,gogogogo,用来更新进度什么的
                return deferred.promise;
            }
            //马上帅多了
            getData()
                .then(executeData.bind(window,["test"]))//通过bind修改参数
                .then(showData)
                .catch(function(){                       //中途运行deferred.reject的话,就触发catch
                    console.log("error");
                })
                .finally(function(){                    //全部执行完就finally
                    console.log(end);
                });

    上面注释相信写得很清楚了。可以使用bind自定义参数。还有$q.all([promise1,promise2,promise3])可以同时执行多个promise,跟执行顺序跟上面有区别。

    为什么叫做$q,$q的全称是什么,知道的请@死我。

  • 相关阅读:
    CF854C Planning优先队列|set
    暑假集训-8.9总结
    暑假集训-8.6总结
    AcWing 206. 石头游戏 矩阵乘法|矩阵快速幂
    暑假集训-8.5总结
    KMP 和 扩展KMP
    暑假集训-8.4总结
    暑假集训-8.3总结
    2019牛客暑期多校第二场题解FH
    AcWing 196. 质数距离
  • 原文地址:https://www.cnblogs.com/geilishu/p/5470076.html
Copyright © 2011-2022 走看看