在上一篇文章《nestjs系列三:nestjs如何通过Module组织代码结构?》(juejin.cn/post/738847…%E4%B8%AD%EF%BC%8C%E6%88%91%E4%BB%AC%E7%9F%A5%E9%81%93%E4%BA%86%60@Module%60%EF%BC%8C%60@Controller%60%EF%BC%8C “https://juejin.cn/post/7388470580464844852)%E4%B8%AD%EF%BC%8C%E6%88%91%E4%BB%AC%E7%9F%A5%E9%81%93%E4%BA%86%60@Module%60%EF%BC%8C%60@Controller%60%EF%BC%8C”) @Injectable等装饰器,那它们是干什么用的呢?

其实,它们的主要作用是为了解决类与类之间的耦合,那什么是耦合呢?

耦合

现在有 AB 两个类,其中 A 依赖 B,这种依赖关系在日常开发中很容易遇到,如果用传统的编码方式,我们一般会这么实现:

 1
 2class B {
 3    constructor() {}
 4}
 5
 6
 7class A {
 8    b:B;
 9    constructor() {
10        this.b = new B();
11    }
12}
13
14
15const a = new A();

这看上去似乎没有什么问题,然而,当需要对 B类进行改造,需要在初始化时传递一个参数 c

 1
 2class B {
 3    c: number;
 4    constructor(c: number) {
 5        this.c = c;
 6    }
 7}

那问题来了,由于 B 是在 A 的构造函数中进行实例化的,我们不得不在 A 的构造函数里传入这个 c 参数。

但是, A 里面的 c 怎么来呢?

我们当然不能写死它,否则设定这个参数就没有意义了,因此我们只能将 c 也设定为 A 构造函数中的一个参数,如下:

 1
 2class A {
 3    b:B;
 4    constructor(c: number) {
 5        this.b = new B(c);
 6    }
 7}
 8
 9
10class C {
11    constructor() {}
12}
13
14
15const a = new A(100);
16console.log(a); 

你发现问题没,当我修改了B类,我需要同时修改A类,本来只是B类变化了,但是因为AB耦合在一起了,所以要修改两处地方。

如果当我们改完了 A 后,发现 B 所需要的 c 不能是一个 number,需要变更为 string,于是我们又不得不重新修改 A 中对参数 c 的类型修饰。

假设还有上层类D依赖 A,用的也是同样的方式,那上层类D也要经历同样的修改。

这就是耦合所带来的问题,明明是修改底层类的一项参数,却需要修改其依赖链路上的所有文件,当应用程序的依赖关系复杂到一定程度时,很容易形成牵一发而动全身的现象,为应用程序的维护带来极大的困难

这就是耦合。那如何解耦呢?

控制反转IOC容器

事实上,在上述例子中,真正需要参数 c 的仅仅只有 B,而 A 完全只是因为内部依赖的对象在实例化时需要 c,才不得不定义这个参数,实际上它对 c ��什么根本不关心。

于是,可以将类所依赖对象的实例化从类本身剥离出来,比如上面的例子我们可以这样改写:

 1
 2class B {
 3    c: number;
 4    constructor(c: number) {
 5        this.c = c;
 6    }
 7}
 8
 9
10class A {
11    private b:B;
12    constructor(b: B) {
13        this.b = b;
14    }
15}
16
17
18const b = new B(100);
19
20const a = new A(b);
21console.log(a); 

此时,A 不再接收参数 c ,而是选择直接接收其内部所依赖的对象,至于这个对象在哪里进行实例化则并不关心,这样有效解决了我们在上面遇到的问题,当我们需要修改参数 c 时,我们仅仅只要修改 B 即可,而不需要修改 A ,这个过程中我们就实现了类与类之间的解耦。

虽然我们实现了解耦,但我们仍需要自己初始化所有的类,并以构造函数参数的形式进行传递

那有没有一个容器能帮我们实现如下功能呢?

  • 它预先注册好了我们所需对象的类定义以及初始化参数,每个对象有一个唯一的 key
  • 当需要用到某个对象时,只需要告诉容器这个对象所对应的 key,就可以直接从容器中取出实例化好的对象

这样开发者就不用再关心对象的实例化过程,也不需要将依赖对象作为构造函数的参数在依赖链路上传递。

也就是说,我们的容器必须具备两个功能:类的注册和类的实例的获取,我们利用Map来简单实现一个容器:

 1
 2export class Container {
 3    bindMap = new Map();
 4
 5    
 6    bind(identifier: string, clazz: any, constructorArgs: Array<any>) {
 7        this.bindMap.set(identifier, {
 8            clazz,
 9            constructorArgs
10        });
11    }
12
13    
14    get<T>(identifier: string): T {
15        const target = this.bindMap.get(identifier);
16        const { clazz, constructorArgs } = target;
17        
18        const inst = Reflect.construct(clazz, constructorArgs);
19    }
20}

有了容器之后,我们就可以彻底抛弃传参实现解耦,如下所示:

 1
 2class B {
 3    constructor(c: number) {
 4        this.c = c;
 5    }
 6}
 7
 8
 9class A {
10    b:B;
11    constructor() {
12        this.b = container.get('b');
13    }
14}
15
16
17const container = new Container();
18container.bind('a', A);
19container.bind('b', B, [100]);
20
21
22const a = container.get('a');
23console.log(a); 

从上面代码中,你能看出什么?

本来A依赖了B,但是在a.ts文件中根本就没有看到B的身影,只有容器 container.get('b')

这就是控制反转,本来是A控制B,但是现在是由容器来控制了。也就是A来实例化B,但是现在由容器来实例化了。

到这里为止,其实已经基本实现了控制反转IOC容器,基于容器完成了类与类的解耦。但从代码量上看似乎并没有简洁多少,关键问题在于容器的初始化以及类的注册仍然让我们觉得繁琐。

如果这部分代码能被封装到框架里面,所有类的注册都能够自动进行,同时,所有类在实例化的时候可以直接拿到依赖对象的实例,而不用在构造函数中手动指定,这样就可以彻底解放开发者的双手,专注编写类内部的逻辑,而这也就是所谓的依赖注入 DI(Dependency Injection)

依赖注入 DI

需要搞清楚的是,控制反转是一种设计模式,目的是解耦,而依赖注入是控制反转的一种技术手段。

依赖注入简��来说就是可以将依赖注入给调用方,而不需要调用方来主动获取依赖

为了实现 DI,主要要解决以下两个问题:

  • 需要注册到 IOC 容器中的类能够在程序启动时自动进行注册;
  • 在 IOC 容器中的类实例化时可以直接拿到依赖对象的实例,而不用在构造函数中手动指定;

对于前端开发来说,利用 TypeScript 具备的装饰器特性,通过Reflect Metadata元数据的修饰来识别出需要进行注册以及注入的依赖,从而完成依赖的注入。

下面的代码就是对类User添加了一个元数据data,它的值为dataValue

 1function TestUser() {
 2  return function (target: any): void {
 3    Reflect.defineMetadata('data', 'dataValue', target);
 4  };
 5}
 6@TestUser()
 7class User {
 8  name = 'lee';
 9}
10
11console.log(Reflect.getMetadata('data', User)); 

对于第一个问题,我们需要在应用启动的时候自动对所有类进行定义和参数的注册,问题是并不是所有的类都需要注册到容器中,我们并不清楚哪些类需要注册的,同时也不清楚需要注册的类,它的初始化参数是什么样的。

这里就可以引入元数据来解决这个问题,只要在定义的时候为这个类的元数据添加特殊的标记,就可以在扫描的时候识别出来。

按照这个思路,我们先来实现一个装饰器标记需要注册的类,这个装饰器可以命名 Provider,代表它将会作为提供者给其他类进行消费。

 1
 2import 'reflect-metadata'
 3
 4export const CLASS_KEY = 'ioc:tagged_class';
 5
 6export function Provider(identifier: string, args?: Array<any>) {
 7    return function (target: any) {
 8        Reflect.defineMetadata(CLASS_KEY, {
 9            id: identifier,
10            args: args || []
11        }, target);
12        return target;
13    };
14}

可以看到,这里的标记包含了 id 和 args,其中 id 是我们准备用来注册 IOC 容器的 key,而 args 则是实例初始化时需要的参数。

Provider 可以以装饰器的形式直接进行使用,使用方式如下:

 1
 2import { Provider } from 'provider';
 3
 4@Provider('b', [100])
 5export class B {
 6    constructor(c: number) {
 7        this.c = c;
 8    }
 9}

标记完成后,问题又来了,如果在应用启动的时候拿到这些类的定义呢?

比较容易想到的思路是在启动的时候对所有文件进行扫描,获取每个文件导出的类,然后根据元数据进行绑定。

简单起见,我们假设项目目录只有一级文件,实现如下:

 1
 2import * as fs from 'fs';
 3import { CLASS_KEY } from './provider';
 4
 5export function load(container) { 
 6  const list = fs.readdirSync('./');
 7
 8  for (const file of list) {
 9    if (/\.ts$/.test(file)) { 
10      const exports = require(`./${file}`);
11      for (const m in exports) {
12        const module = exports[m];
13        if (typeof module === 'function') {
14          const metadata = Reflect.getMetadata(CLASS_KEY, module);
15          
16          if (metadata) {
17            container.bind(metadata.id, module, metadata.args)
18          }
19        }
20      }
21    }
22  }
23}

那么现在,我们只要在 main.ts 中运行 load.ts 即可完成项目目录下所有被修饰的类的绑定工作,值得注意的是,load 和 Container 的逻辑是完全通用的,它们完全可以被封装成包,一个简化的 IOC 框架就成型了。

 1
 2import { Container } from './container';
 3import { load } from './load';
 4
 5
 6const container = new Container();
 7
 8load(container);
 9
10console.log(container.get('a')); 

解决注册的问题后,现在来看上文中提到的第二个问题:如何在类初始化的时候能直接拿到它所依赖的对象的实例,而不需要手动通过构造函数进行传参

其实也很简单,我们已经将所有需要注册的类都放入了 IOC 容器,那么,当我们需要用到某个类时,在获取这个类的实例时可以递归遍历类上的属性,并从 IOC 容器中取出相应的对象并进行赋值,即可完成依赖的注入

那么,又是类似的问题,如何区分哪些属性需要注入?

同样,我们可以使用元数据来解决。

只要定义一个装饰器,以此来标记哪些属性需要注入即可,这个装饰器命名为 Inject,代表该属性需要注入依赖。

 1
 2import 'reflect-metadata';
 3
 4export const PROPS_KEY = 'ioc:inject_props';
 5
 6export function Inject() {
 7    return function (target: any, targetKey: string) {
 8        const annotationTarget = target.constructor;
 9        let props = {};
10        if (Reflect.hasOwnMetadata(PROPS_KEY, annotationTarget)) {
11            props = Reflect.getMetadata(PROPS_KEY, annotationTarget);
12        }
13        
14        props[targetKey] = {
15            value: targetKey
16        };
17
18        Reflect.defineMetadata(PROPS_KEY, props, annotationTarget);
19    };
20}

需要注意的是,这里我们虽然是对属性进行修饰,但实际元数据是要定义在类上,而不是类的原型上,以维护该类需要注入的属性列表,因此我们必须取 target.constructor 作为要操作的 target。

另外,为了方便起见,这里直接用了属性名(targetKey)作为从 IOC 容器中实例对应的 key。

使用的时候,用 Inject 对需要的属性进行修饰即可:

 1
 2import { Provider } from 'provider';
 3
 4@Provider('a')
 5export class A {
 6    @Inject()
 7    b: B;
 8}

然后,我们需要修改 IOC 容器的 get 方法,递归注入所有属性:

 1
 2import { PROPS_KEY } from './inject';
 3
 4export class Container {
 5    bindMap = new Map();
 6
 7    bind(identifier: string, clazz: any, constructorArgs?: Array<any>) {
 8        this.bindMap.set(identifier, {
 9            clazz,
10            constructorArgs: constructorArgs || []
11        });
12    }
13
14    get<T>(identifier: string): T {
15        const target = this.bindMap.get(identifier);
16
17        const { clazz, constructorArgs } = target;
18        
19        const props = Reflect.getMetadata(PROPS_KEY, clazz);
20        
21        const inst = Reflect.construct(clazz, constructorArgs);
22        
23        
24        for (let prop in props) {
25            
26            const identifier = props[prop].value;
27            
28            inst[prop] = this.get(identifier);
29        }
30        return inst;
31    }
32}

经过上述调整后,最终我们的业务代码成了这样:

 1
 2
 3@Proivder('b', [100]) 
 4class B {
 5    constructor(c: number) {
 6        this.c = c;
 7    }
 8}
 9
10
11
12@Proivder('a')
13class A {
14    
15    @Inject() 
16    private b:B;
17}
18
19
20const container = new Container();
21load(container);
22
23console.log(container.get('a'));  

可以看到,代码中不会再有手动进行实例化的情况,无论要注册多少个类,框架层都可以自动处理好一切,并在这些类实例化的时候注入需要的属性。所有类可提供的实例都由类自身来维护,即使存在修改也不需要改动其他文件

nestjs 就是一个 IOC 容器

我们现在再看一下nestjs中的代码:

 1
 2@Controller('son')
 3export class SonController {
 4  
 5  
 6  
 7  @Inject(SonService)
 8  private readonly sonService: SonService;
 9
10  @Post()
11  create(@Body() createSonDto: CreateSonDto) {
12    return this.sonService.create(createSonDto);
13  }
14}
15
16
17@Injectable()
18export class SonService {
19  create(createSonDto: CreateSonDto) {
20    return 'This action adds a new son';
21  }
22}

首先,通过装饰器Controller, Injectable把类注册到 IOC 容器中。然后,类SonController依赖了类SonService,但是我们并没有在SonController中去new SonService(),而是使用装饰器@Inject(SonService)进行了标注,在实例化SonController类时,框架nestjs就会自动帮我们依赖的类进行实例化,并注入到对应的属性中,所以,我们就可以使用this.sonService(SonService类的实例)。

这就是nestjs框架的作用。

声明:本文内容来源于网易技术团队写的文章《如何基于 TypeScript 实现控制反转》,只是加入了自己的一些理解,之所以写这篇文章,主要是为了加深对依赖注入的理解。

个人笔记记录 2021 ~ 2025