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的全称是什么,知道的请@死我。

  • 相关阅读:
    Adobe CS6 系列软件通用破解补丁 (amtlib.dll 含32位与64位)
    vs2010 快捷键大全
    js 处理json时间格式
    绑定DropDownListFor
    js插件
    NHibernate资料收集
    常用正则
    jQuery里面的datepicker日期控件默认是显示英文的,如何显示中文或其他语言呢?
    ASP.NET中使用Fusion Charts(Access+SQL)图表工具
    asp.net 2.0揭秘读书笔记二:使用Rich控件
  • 原文地址:https://www.cnblogs.com/geilishu/p/5470076.html
Copyright © 2011-2022 走看看