zoukankan      html  css  js  c++  java
  • Angularjs promise对象解析

    1、先来看一段Demo,看完这个demo你可以思考下如果使用$.ajax如何处理同样的逻辑,使用ng的promise有何优势?

    var ngApp=angular.module('ngApp',[]);
    			
    /*******************************************************************
     * $q为内置服务
    ****************************************************************/
    ngApp.factory('UserInfoService',['$http','$q',function($http,$q){
    	return{
    	   query:function(){
    		var defer=$q.defer();  //声明延后执行
    		$http({method:'GET',url:'data/students.json'}).
    		success(function(data,status,headers,config){
    			defer.resolve(data);  //声明执行成功
    			console.log('UserInfoService success');
    		}).
    		error(function(data,status,headers,config){
    			defer.reject();      //声明执行失败
    		});
    						
    		return defer.promise; //返回承诺,返回获取数据的API
    		}
    		}
    	}]);
    			
    	ngApp.controller('MainCtrl',['$scope','UserInfoService',function($scope,UserInfoService){
    	     var promise = UserInfoService.query();  //同步调用,获取承诺接口
    		promise.then(function(data){
    			$scope.user=data;  //调用承诺接口resolove()
    			console.log('MainCtrl ...');
    			},function(data){
    			  $scope.user={error:'数据不存在。。。'}; //调用承诺接口reject();
    			});
    				
    			}]);
    

    2、什么是promise?

          promise是一种用异步的方式处理值的方法,promise是对象,代表了一个函数最终可能的返回值或者抛出的异常,在与远程对象打交道时我们可以把他看作是远程对象的一个代理。 如果说是promise也是异步处理方式的一种,那么我们会想起它和XHR和$.ajax有啥区别呢? 

         习惯上js使用闭包或者回调来相应非同步返回的数据,比如页面加载之后的XHR请求。我们可以跟数据进行正常交互,就好像它已经返回了一样,而不需要依赖回调函数的触发。

         那么ng提出的promise是为了解决什么问题呢? 回调已经被使用了很长时间,通常如果有回调依赖其他还回调时将会时调试变得非常艰难,每一步调用之后都需要显示处理错误。与之不同的是promise提供了另外一个抽象:这些函数返回promise对象。

         从一定层面上看ng改变的不是简单的改变代码风格,而是让我对一些思维习惯发起了反思和改善。

    回调示例

    User.get(fromId,{
        success:function(){
              user.friends.find(toId,function(){})
        },
        failure:function(){} 
    })
    

    ng promise示例

    User.get(fromId).
       then(function(user){
    
        },function(err){
    
    }).
       then(function(){},function(){});
    

      

    3、为什么使用promise

          使用了promise的收获之一是逃脱了回调的固定思维逻辑。promise让异步处理的机制看上去更像是同步,基于同步函数我们可以按照预期来捕获返回值和异常值。可以在程序中的任何时刻捕捉错误,并且绕过依赖于程序异常的后续代码,我们不需要思考这个同步带来的好处。因此使用promise的目的是:获取功能组合和错误冒泡能力的同时,保持代码异步运行的能力。

          promise是头等对象,自带了一些约定。

    •  只有一个resolve或者reject会被调用到
    •  如果promise被执行或者被拒绝了,依赖于他们的处理程序仍然会被调用
    •  处理程序总是会被异步调用

                 

    4、如何创建promise

          想要在angularjs中创建promise,可以使用内置的$q服务,$q服务在它的deferred API中提供了一些方法。

          首先把它注入到你想使用它的对象中

          

    angular.module('ngApp',[]).
    factory('UserInfoService',['$q',function($q){
        //code here
    }])
    

       要创建一个deferred对象,可以调用defer()方法; var deferred= $q.defer();

         deferred对象暴露了三个方法,以及一个可以用于处理promise的promise属性。

    • resolve(value)。 deferred.resolve({name:"Kobe",Age:36});
    • reject(reason)。 deferred.reject("Can't update user");
    • notify(value)。这个方法用promise的执行状态进行响应。 
    • then(successFn,errFn,notifyFn)。
    • catch(errFn)。
    • finally(callback)。finally允许我们观察promise的执行或者拒绝,而无需修改结果的值。通常就做一些资源的清理工作。

    5、链式请求

          

    GitHubService.then(function(data){
    
    }).then(function(data){
        $scope.Users=data;
    });
    

      

  • 相关阅读:
    收集 关于php的博文
    hdwiki中插件开发指南
    MySQL中“”的坑
    SpringBoot生成验证码
    Spring中的循环依赖问题
    深入理解AQS(抽象队列同步器)
    JUC下线程的三种等待唤醒机制
    关于List集合的去重
    MySQL:去除 字符串
    MySQL:Can't connect to MySQL server on 'localhost'(10061)
  • 原文地址:https://www.cnblogs.com/sword-successful/p/4626797.html
Copyright © 2011-2022 走看看