angular 服务的单例模式(依赖注入模式下)详解

发布时间:2019-06-12 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了angular 服务的单例模式(依赖注入模式下)详解脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
文章中有不合理和错误的地方欢迎小伙伴雅正

Angular官方文档单例服务的说明

单例模式就不要说了,懂点设计模式的都懂得,真有不明白的自行百度
(解释下angular的命名,angular就是angular2+,angular1叫angularjs,至于angular2,3,4,5,6只是angular的版本,通称angular,希望小伙伴不要叫错了)
单例模式如何在angular的服务中使用呢,angular的官方文档中有这么一段话:@H_406_8@

单例服务
服务在每个注入器的范围内是单例的。 在任何一个注入器中,最多只会有同一个服务的一个实例。
这里只有一个根注入器,而 UserService 就是在该注入器中注册的。 所以,在整个应用中只能有一个 UserService 实例,每个要求注入 UserService 的类都会得到这个服务实例。
不过Angular DI 是一个 多级注入系统,这意味着各级注入器都可以创建它们自己的服务实例。 Angular 总会创建多级注入器。

笼统,并不知道依赖注入服务单例模式怎么用,要想弄明白很简单,简单的写个例子实验一下就可以了,下面我会给大家说一下我的实验总结,帮助小伙伴节约一些这种乏味的探索时间。

实验样例代码

服务代码

import { Injectable } From '@angular/core';

@Injectable(
  //{PRovidedIn: 'root'}
)
export class SingletonServivetestService {
  private _name = "PrimaryName";
  constructor() { }
  setName (name){
    this._name = name;
  }
  getName(){
    return this._name;
  }
}

小伙伴可能会说了,这TM怎么会是单例模式。小伙伴不要激动,我也是这么想的,怎么TM怎么会是单例。不过在angular的依赖注入中,有几种写法确实会使这种代码以单例模式的方式运行。
解释下{providedIn: 'root'},一开始认为只要传入这个对象,让服务以root的方式提供给子module,子组件,然后这个服务就是单例的,后台发现,这个对象和单例没有毛钱关系,它只是app.module中引入服务的另一种写法,除了这个用处,没有别的用处,所以下文中我们就不说添加和不添加{providedIn: 'root'}的情况了

注入代码
注入分为Module.providerscomponent.providers两种;实验的module是实现懒加载的。

上面代码的测试结果(module都是懒加载的)

这三个结果已经代表各种情况了,如果小伙伴还想知道其他一些情况的下的结果,小伙伴可以自己动手写个例子,或者给我留言
  1. app.module.providers或者app.COMponent.providers中依赖面进去这个服务,在子component和子module中的component中的构造函数中国呢注入进去这个服务,这个服务的表现特征是 单例 的。
  2. 在懒加载的子module.providers 中依赖进去这个服务,在这个module下面的component中的构造函数中注入进去这个服务,这个服务表现特征是 单例 的。
  3. component.providers中依赖进去这个服务,然后在component的构造函数中依赖注入进去这个服务,这个服务表现特征是 非单例 的.

单例不都通过静态属性来实现的吗?

我认为单例就是实现属性方法的保持一个实例,而angular中想用到单例多是实现一些数据整个项目通用,按照设计模式上讲上面和下面的代码都不是标准的单例模式的写法,但是在实际使用中确实是达到了单例模式的目的,上吗的有angular的官方文档做背书,所以我就写了上吗那种在angular中可以是单例模式,至于下面这中我就叫静态属性单一模式,ts静态属性被编译成正常的js,就是构造函数上的属性而已,概念高大上,原理矮小low。
@H_488_126@import { Injectable } from '@angular/core'; @Injectable() export class SingletonServiveTestService { private static _name = "primaryName"; constructor() { } setName (name){ SingletonServiveTestService._name = name; } getName(){ return SingletonServiveTestService._name; } }

这个实验着在各种情况下都能表现 单例 特征

这种方法万金油,单例就用这中不久ok了,小伙伴写代码要考究,莫要粗放。结合上面代码代码的单例实现根据具体使用场景来选择用那种方式。
真正严格的用单例模式的话是用不上angular服务的依赖注入的这套机制的。至于要不要使用单例抛掉依赖注入,看业务场景了。

????????????????????如果能帮助到小伙伴的话欢迎点个赞????????????????????
????????????????????如果能帮助到小伙伴的话欢迎点个赞????????????????????

脚本宝典总结

以上是脚本宝典为你收集整理的angular 服务的单例模式(依赖注入模式下)详解全部内容,希望文章能够帮你解决angular 服务的单例模式(依赖注入模式下)详解所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。