我是伊只雄熊

导航

AngularJS 服务 provider factory service及区别

一、概念说明

  1、服务是对公共代码的抽象,如多个控制器都出现了相似代码,把他们抽取出来,封装成一个服务,遵循DRY原则,增强可维护性,剥离了和具体表现相关的部分,聚焦于业务逻辑或交互逻辑,更加容易被测试和复用。

  2、工程实战中,使用服务的目的使为了优化结构,复用是一项结果,而不是目标。

  3、代码中混杂表现层逻辑和业务逻辑的时候,就可以抽取服务,哪怕它不能复用。

  4、测试驱动开发方式,服务有利于写测试用例。

  5、服务是和依赖注入相关的,依赖注入要求服务都是单例,才能把它们到处注入,不用手动管理它们的生命周期,并可以“”延迟初始化“”等优化措施。

  6、服务分常量(Constant)、变量(Value),服务(Service)、工厂(Factory)、供应商(Provider)。

  7、变量和常量的区别是,变量的值可以被修改;服务是AngularJS会New出来,然后保存实例,供它注入,而工厂 ,AngularJS不会New,其会调用工厂里的函数,获取返回值,然后保存这个返回值,供它到处注入;Constant和Provider 可以传进 .config() 函数的服务,在Config阶段就可以用,其他都是要Provider实例化的结果,要在Config阶段完成后可用;除了常量外,其他服务背后都是通过Provider来实现的,可以看成是一张语法糖,编译后,其实都是Provider。

二、例子

1、provider provide

  只要满足规则:提供一个带有返回值的$get方法。

  是唯一一种可以传进 .config() 函数的 service。当你想要在 service对象启用之前,先进行模块范围的配置,那就应该用 provider。

app.provider('test', function() {  
    console.log('instance test');  
    var f = function(name) {  
        alert("Hello, " + name);  
    };  
    this.$get = function() { //一定要有!  
        return f;  
    };  
});  

app.config(function(testProvider) {  
    testProvider('I am config');  
});

   $provide服务负责告诉Angular如何创造一个新的可注入的东西:即服务。服务会被叫做供应商的东西来定义,你可以使用$provide来创建一个供应商。你需要使用$provide中的provider()方法来定义一个供应商,同时你也可以通过要求$provide被注入到一个应用的config函数中来获得$provide服务。使用方法是返回一个$get函数,注意在config阶段,只有provider能被注入

app.config(function($provide) {  
    $provide.provider('greeting', function() {  
        this.$get = function() {  
            return function(name) {  
                alert("Hello," + name);  
            };  
        };  
    });  
  /*  greetingProvider('ff');*/  
}); 

 

2、factory

  factory 可以说是 provider 的变种, 方法中的第二个参数就是 $get 中的内容,需要new 一个对象返回。

app.factory('myFactory', function() {  
    console.log('instance myFactory');  
    var factory = {};  
    var privateValue = "I am Private";  
    factory.variable = "This is public";  
    factory.getPrivate = function() {  
        return privateValue;  
    };  
    return factory;  
});  

 

3、service

  在 factory中需要 new 一个对象返回,而 service 就更简单了,这一步都帮你省了, 他的第二个参数就是你要返回的对象类,一般直接用this来操作数据、定义函数

app.service('myService', function() {  
    var privateValue = "I am Private";  
    this.variable = "This is public";  
    this.getPrivate = function() { return privateValue;  
};  
});

 

三、区别

  1、用 factory 就是创建一个对象,为它添加属性,然后把这个对象返回出来。你把 service 传进 controller 之后,在 controller 里这个对象里的属性就可以通过 factory 使用了。
  2、service 是用"new"关键字实例化的。因此,你应该给"this"添加属性,然后 service会 返回"this"。你把 service 传进 controller 之后,在controller里 "this" 上的属性就可以通过 service 来使用了。
  3、 providers 是唯一一种你可以传进 .config() 函数的 service。当你想要在 service 对象启用之前,先进行模块范围的配置,那就应该用 provider。
  4、factory/service是第一个注入时才实例化,而provider不是,它是在config之前就已实例化好
  5、service定义的function是一个构造器(constructor),Angular在调用service时会用new关键字,而调用factory时只是调用普通的function,所以factory可以返回任何东西,service不需要返回。
四、选择服务类型
  1、需要全局可配置参数, 选择Provider
  2、纯数据,没有行为,选择Value
  3、Angular会New,而且只一次,不用参数 用Service
  4、拿到类,自己New出实例, 用Factory
  5、拿到函数,自己调用,用Factory
  总结,是纯数据,先用Value,当发现有行为,改为Service,当发现通过计算得出结果时,用Factory,当需要全局配置的话,用Provider。

posted on 2018-02-24 18:04  我是伊只雄熊  阅读(277)  评论(0编辑  收藏  举报