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

  • 相关阅读:
    JavaScript ECMAScript 2015 (ES6) 和 ECMAScript 2016 (ES7) 新特性速查
    Sass中文文档
    TypeScript手册中文版
    敏捷:什么是用户故事(User Story)
    Repeater为空时显示“暂无数据”,很方便实用方法
    jquery之css()改变字体大小,颜色,背景色
    七牛 在线管理 v0.1
    clion idea jetbrain windows下搞c/c++
    amazeui 搜索 动态
    命令行启动软件
  • 原文地址:https://www.cnblogs.com/geilishu/p/5470076.html
Copyright © 2020-2023  润新知