原文链接

InversityJS 是一个 IoC 框架。IoC(Inversion of Control) 包括依赖注入(Dependency Injection) 和依赖查询(Dependency Lookup)。

相比于类继承的方式，控制反转解耦了父类和子类的联系。

  1. import 'reflect-metadata'
  2. import { inject, injectable, Container } from 'inversify'
  4. const container = new Container()
  6. @injectable()
  7. class PopMusic {
  8.   getName() {
  9.     return '流行音乐'
  10.   }
  11. }
  12. container.bind('request1').to(PopMusic)
  14. @injectable()
  15. class ClassicalMusic {
  16.   getName() {
  17.     return '古典音乐'
  18.   }
  19. }
  20. container.bind('request2').to(ClassicalMusic)
  22. @injectable()
  23. class Music {
  24.   pm: any
  25.   cm: any
  26.   constructor(
  27.     @inject('request1') popMusic: any,
  28.     @inject('request2') classicalMusic: any) {
  29.     this.pm = popMusic
  30.     this.cm = classicalMusic
  31.   }
  33.   getName() {
  34.     const result = this.pm.getName() + this.cm.getName()
  35.     return result
  36.   }
  37. }
  38. container.bind('Plan').to(Music)
  40. const music: any = container.get('Plan')
  41. console.log(music.getName()) // 流行音乐古典音乐

上述案例可以抽象为下图：

虚线表示可以注入，但在代码中没有表现出来。

代码流程可概括如下：

1.将所有相关类(这里指 Music、popMusic、classicMusic) 通过 @injectable 声明进 container 容器;

2.通过 container.get() 获取 container.bind().to(target) 中的目标对象(这里指 Music);

3.如果目标对象中的 constructor() 里有 @inject(), 则将相应的实例(这里指 PopMusic 与 classicalMusic 的实例)当作构造函数的参数’注入’;

inject 源码简化如下：

  1. // 这是一个属性装饰器
  2. function inject(serviceIdentifier) {
  3.   return function (target, targetKey) {
  4.     const metadataValue = { [targetKey]: [Metadata { key: 'inject', value: serviceIdentifier })] }
  5.     Reflect.defineMetadata('inversify:tagged_props', metadataValue, target.constructor);
  6.   }
  7. }

injectable 源码简化如下：

  1. // 这是一个类装饰器
  2. function injectable() {
  3.   return function (target) {
  4.     const metadataValue = []
  5.     Reflect.defineMetadata('inversify:paramtypes', metadataValue, target)
  6.     return target
  7.   }
  8. }

从简化版源码中可以看到 inject/injectable 最终是对 Reflect.defineMetadata() 的一个使用。可以将 metadata 看成是一种相对高效的数据结构。

InversityJS 深度结合了 reflect-metadata, reflect-metadata 在 Reflect 基础上对其 api 进行了扩展。

metadata 本质上是一个 WeakMap 对象。扩展：Map 和 WeakMap 的区别

Reflect.defineMetadata(metadataKey, metadataValue, target[, propertyKey]) 简化版实现如下：

  1. const Metadata = new WeakMap()
  3. function defineMetadata(metadataKey, metadataValue, target, propertyKey) {
  4.   metadataMap = new Map()
  5.   metadataMap.set(metadataKey, metadataValue)
  6.   targetMetadata = new Map()
  7.   targetMetadata.set(propertyKey, metadataMap)
  8.   Metadata.set(target, targetMetadata)
  9. }

Reflect.getOwnMetadata(metadataKey, target[, propertyKey]) 简化版实现如下：

  1. function getOwnMetadata(metadataKey, target, propertyKey) {
  2.   var targetMetadata = Metadata.get(target)
  3.   var metadataMap = targetMetadata.get(propertyKey)
  4.   return metadataMap.get(metadataKey)
  5. }

其数据结构可表示如下：

  1. WeakMap {
  2.   target: Map {
  3.     propertyKey: Map {
  4.       metadataKey: metadataValue
  5.     }
  6.   }
  7. }

版权声明：本文为MuYunyun原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/MuYunyun/p/9922888.html