文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

Angular中的依赖注入是什么及怎么应用

2023-07-04 17:18

关注

本篇内容介绍了“Angular中的依赖注入是什么及怎么应用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

依赖注入是什么

依赖注入简称DI,是面向对象编程中的一种设计原则,用来减少代码之间的耦合度。

我们先来看一段代码

class Video{    constructor(url){}}class Note{    video: Video    constructor(){        this.video = new Video("https://aaaaa.mp4")    }        getScreenshot(){        this.video.getScreenshot()    }}const note = new Note()note.getScreenshot()

假设我们用一个视频类,它其中有一个方法 getScreenshot 获取截图,在实例化视频类的时候,需要传入一个视频 url 这样的参数。现在有一个笔记类,它需要去调用视频类下的截图方法,那么我们就可以说,笔记类是依赖于视频类的。所以在笔记类的内部,我们就需要去实例化视频类,这样才能在笔记类中获取视频类的实例对象,并且调用它里面的截图方法。

上面代码的耦合度过高,并不推荐使用,比方说如果Video的视频地址换了一个,那么在Note中就需要去改变传入的视频url,这样假设要是有更多的类依赖于视频类,那么一旦做出更改,那么所有地方都要跟着改变,非常的不方便。

接下来利用依赖注入解决上面的问题:

class Note{    video: Video    constructor(video: Video){        this.video = Video;    }}const video = new Video("https://aaaaa.mp4")const note = new Note(video)

我们在类的外部去实例化视频类,并且通过参数传递的方式把实例传递给了笔记类,通过这样的方式就能够成功解决耦合度过高的问题,我们把通过参数传递实例的这种方式称为:注入。

优点

通过依赖注入降低了代码之间的耦合度,增加了代码的可维护性。视频类中的代码更改也不会去影响到笔记类了。

Angular的DI框架

在上述实现的过程当中,还是有着一个不是特别理想的地方,就是我们需要在类的外部去实例化视频类,虽然只有这一处,但是我们还是希望视频类的内部再怎么更改,都不会影响外部代码。

在 Angular 提供的 DI 框架中,我们就不需要自己去做视频类的实例化操作,它将实现依赖注入的过程隐藏了,对于开发者来说,只需要使用很简单的代码就可以使用复杂的依赖注入功能。

在 Angular 的 DI 有四个核心的概念:

Injector注入器

我们先通过Angular提供的基本语法来创建一个注入器

创建注入器

import { ReflectiveInjector } from "@angular/core"//服务类class Video{}//创建注入器并传入服务类const injector = ReflectiveInjector.resolveAndCreate([ Video ])

引入ReflectiveInjector其中resolveAndCreate方法用于创建注入器,它接收一个数组,数组中就是需要创建实例对象的类,这个方法会返回一个注入器2. 获取注入器中的服务类实例对象

const video = injector.get(Video)

在injector下有一个get方法,用于传入标识并且获取实例对象,默认标识就是服务类的名称也就是Video

这样我们就能够获取到Video的实例对象了,Angular给我们提供的这套DI框架使得我们不需要去手动的实例化某一个类来获得它的实例对象,它会来帮我们完成。

服务的实例对象为单例模式,注入器在创建服务实例后悔对其进行缓存

const video1 = injector.get(Video)const video2 = injector.get(Video)console.log(video1 === video1)//true

也就是说,无论通过框架获取多少次实例对象,他返回的都是同一个实例对象

但是我们可以通过创建多个注入器,不同的注入器返回的同一个服务实例化的对象不是同一个

const injector1 = ReflectiveInjector.resolveAndCreate([ Video ])const injector2 = ReflectiveInjector.resolveAndCreate([ Video ])const video1 = injector1.get(Video)const video2 = injector2.get(Video)console.log(video1 === video1)//false

注入器上面存在一个创建子级注入器的方法为 resolveAndCreateChild,这个方法会创建一个子级注入器,父级注入器和子级注入器之间的关系类似于js的作用域链,当前注入器查找不到就会去父级注入器查找,比如:

const injector = ReflectiveInjector.resolveAndCreate([ Video ])const injectorChild = injector.resolveAndCreateChild([])const video1 = injector.get(Video)const video2 = injectorChild.get(Video)console.log(video1 === video1)//true

像上面这段代码,我们在创建子级注入器的时候,不传递参数,但是在子级注入器实例化的时候,由于自身不存在 Video 这个服务,它就会去父级查找,当然,就找到了父级的 Video 这个服务并且实例化,所以后面的两个实例化对象相等。

“Angular中的依赖注入是什么及怎么应用”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站,小编将为大家输出更多高质量的实用文章!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     801人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     348人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     311人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     432人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     220人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯