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


Posted in Javascript onOctober 22, 2018

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

单例模式就不要说了,懂点设计模式的都懂得,真有不明白的自行百度。

(解释下angular的命名,angular就是angular2+,angular1叫angularjs,至于angular2,3,4,5,6只是angular的版本,通称angular,希望小伙伴不要叫错了)

单例模式如何在angular的服务中使用呢,angular的官方文档中有这么一段话:

单例服务

服务在每个注入器的范围内是单例的。 在任何一个注入器中,最多只会有同一个服务的一个实例。

这里只有一个根注入器,而 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.providers和Component.providers两种;实验的module是实现懒加载的。

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

这三个结果已经代表各种情况了,如果小伙伴还想知道其他一些情况的下的结果,小伙伴可以自己动手写个例子,或者给我留言

  • 在app.module.providers或者app.component.providers中依赖面进去这个服务,在子component和子module中的component中的构造函数中国呢注入进去这个服务,这个服务的表现特征是 单例 的。
  • 在懒加载的子module.providers 中依赖进去这个服务,在这个module下面的component中的构造函数中注入进去这个服务,这个服务表现特征是 单例 的。
  • 在component.providers中依赖进去这个服务,然后在component的构造函数中依赖注入进去这个服务,这个服务表现特征是 非单例 的.

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

我认为单例就是实现属性方法的保持一个实例,而angular中想用到单例多是实现一些数据整个项目通用,按照设计模式上讲上面和下面的代码都不是标准的单例模式的写法,但是在实际使用中确实是达到了单例模式的目的,上吗的有angular的官方文档做背书,所以我就写了上吗那种在angular中可以是单例模式,至于下面这中我就叫静态属性单一模式,ts静态属性被编译成正常的js,就是构造函数上的属性而已,概念高大上,原理矮小low。

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服务的依赖注入的这套机制的。至于要不要使用单例抛掉依赖注入,看业务场景了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript学习笔记6 prototype的提出
Jan 11 Javascript
20个最新的jQuery插件
Jan 13 Javascript
谈谈关于JavaScript 中的 MVC 模式
Apr 11 Javascript
JavaScript实现的背景自动变色代码
Oct 17 Javascript
JS中innerHTML和pasteHTML的区别实例分析
Jun 22 Javascript
js轮播图透明度切换(带上下页和底部圆点切换)
Apr 27 Javascript
JS正则表达式验证中文字符
May 08 Javascript
浅谈js获取ModelAndView值的问题
Mar 28 Javascript
详解在React-Native中持久化redux数据
May 22 Javascript
通过实例了解Javascript柯里化流程
Mar 03 Javascript
antd-DatePicker组件获取时间值,及相关设置方式
Oct 27 Javascript
为什么推荐使用JSX开发Vue3
Dec 28 Vue.js
vue 配置多页面应用的示例代码
Oct 22 #Javascript
微信小程序引用iconfont图标的方法
Oct 22 #Javascript
详解微信小程序与内嵌网页交互实现支付功能
Oct 22 #Javascript
js异步上传多张图片插件的使用方法
Oct 22 #Javascript
js实现动态添加上传文件页面
Oct 22 #Javascript
Javascript 实现 Excel 导入生成图表功能
Oct 22 #Javascript
js实现动态增加文件域表单功能
Oct 22 #Javascript
You might like
PHP与javascript对多项选择的处理
2006/10/09 PHP
PHP mb_convert_encoding 获取字符串编码类型实现代码
2009/04/26 PHP
PHP 日期时间函数的高级应用技巧
2009/10/10 PHP
php+ajax简单实现全选删除的方法
2016/12/06 PHP
一些javascript一些题目的解析
2010/12/25 Javascript
去掉gridPanel表头全选框的小例子
2013/07/18 Javascript
js设置cookie过期当前时间减去一秒相当于立即过期
2014/09/04 Javascript
jQuery中removeClass()方法用法实例
2015/01/05 Javascript
js省市联动效果完整实例代码
2015/12/09 Javascript
JS代码实现根据时间变换页面背景效果
2016/06/16 Javascript
详解微信小程序 wx.uploadFile 的编码坑
2017/01/23 Javascript
详解用Webpack与Babel配置ES6开发环境
2019/03/12 Javascript
详解JS取出两个数组中的不同或相同元素
2019/03/20 Javascript
使用webpack5从0到1搭建一个react项目的实现步骤
2020/12/16 Javascript
[00:20]TI9观赛名额抽取Ⅱ
2019/07/24 DOTA
[34:47]完美世界DOTA2联赛PWL S2 Magma vs LBZS 第一场 11.18
2020/11/18 DOTA
Python def函数的定义、使用及参数传递实现代码
2014/08/10 Python
Python解析xml中dom元素的方法
2015/03/12 Python
Python实现繁体中文与简体中文相互转换的方法示例
2018/12/18 Python
Django Rest framework频率原理与限制
2019/07/26 Python
centos7之Python3.74安装教程
2019/08/15 Python
使用OpenCV-python3实现滑动条更新图像的Canny边缘检测功能
2019/12/12 Python
Python Tornado之跨域请求与Options请求方式
2020/03/28 Python
Python多线程threading创建及使用方法解析
2020/06/17 Python
施华洛世奇德国官网:SWAROVSKI德国
2017/02/01 全球购物
For Art’s Sake官网:手工制作的奢华眼镜
2018/12/15 全球购物
Schecker荷兰:狗狗用品和配件
2019/06/06 全球购物
Set里的元素是不能重复的,那么用什么方法来区分重复与否呢? 是用==还是equals()? 它们有何区别?用contains来区分是否有重复的对象。还是都不用
2013/07/30 面试题
Linux如何命名文件--使用文件名时应注意
2014/05/29 面试题
自荐信格式写作方法有哪些呢
2013/11/20 职场文书
家居设计专业个人自荐信范文
2013/11/26 职场文书
高中英语演讲稿范文
2014/04/24 职场文书
面试通知短信
2015/04/20 职场文书
2015年度环卫处工作总结
2015/07/24 职场文书
2016年11月份红领巾广播稿
2015/12/21 职场文书
Redis延迟队列和分布式延迟队列的简答实现
2021/05/13 Redis