让我们来看看 InversifyJS 在 TypeScript 下的一些基本示例:

第一步:声明您的接口和类型

我们的目的是让开发者的代码能够遵循依赖倒置。这意味着我们应当“化具体为抽象”。首先我们应该声明一些(抽象)接口

// 文件📃 interfaces.ts

export interface Warrior {
    fight(): string;
    sneak(): string;
}

export interface Weapon {
    hit(): string;
}

export interface ThrowableWeapon {
    throw(): string;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14

InversifyJS 需要在运行时(runtime)使用这些类型(type)作为标识符。这里我们使用了Symbol,但您也可以使用类或字符串。

// 文件📃 types.ts

const TYPES = {
    Warrior: Symbol.for("Warrior"),
    Weapon: Symbol.for("Weapon"),
    ThrowableWeapon: Symbol.for("ThrowableWeapon")
};

export { TYPES };
1
2
3
4
5
6
7
8
9

注意:我们虽然推荐使用 Symbol 不过 InversifyJS 也是支持类和字符串的。

第二步:用 @injectable 和 @inject 装饰器声明依赖

让我们继续声明一些(具体)类。这些类是我们刚才所声明的接口的实现。所有的类都必须使用 @injectable 装饰器修饰。

当一个类依赖于依赖接口时,我们还需要使用 @inject 装饰器来定义一个在运行时可用的接口标识符。在这个例子中,我们使用了Symbol.for('weapon')Symbol.for('ThrowableWeapon')作为运行时标识符

// 文件📃 entities.ts

@injectable()
class Katana implements Weapon {
    public hit() {
        return "cut!";
    }
}

@injectable()
class Shuriken implements ThrowableWeapon {
    public throw() {
        return "hit!";
    }
}

@injectable()
class Ninja implements Warrior {

    private _katana: Weapon;
    private _shuriken: ThrowableWeapon;

    public constructor(
	    @inject(TYPES.Weapon) katana: Weapon,
	    @inject(TYPES.ThrowableWeapon) shuriken: ThrowableWeapon
    ) {
        this._katana = katana;
        this._shuriken = shuriken;
    }

    public fight() { return this._katana.hit(); }
    public sneak() { return this._shuriken.throw(); }

}

export { Ninja, Katana, Shuriken };
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

如果觉得还不错,您可以使用属性注入来代替构造函数注入,这样您就不必声明类构造函数了:

@injectable()
class Ninja implements Warrior {
    @inject(TYPES.Weapon) private _katana: Weapon;
    @inject(TYPES.ThrowableWeapon) private _shuriken: ThrowableWeapon;
    public fight() { return this._katana.hit(); }
    public sneak() { return this._shuriken.throw(); }
}
1
2
3
4
5
6
7

第三步:创建并配置一个容器

这里我们建议在一个名为inversify.config.ts中执行该操作。这是唯一存在耦合的地方。在应用的其他部分中,不应该再存在任何对其他类的引用了。

// 文件📃 inversify.config.ts

import { Container } from "inversify";
import { TYPES } from "./types";
import { Warrior, Weapon, ThrowableWeapon } from "./interfaces";
import { Ninja, Katana, Shuriken } from "./entities";

const myContainer = new Container();
myContainer.bind<Warrior>(TYPES.Warrior).to(Ninja);
myContainer.bind<Weapon>(TYPES.Weapon).to(Katana);
myContainer.bind<ThrowableWeapon>(TYPES.ThrowableWeapon).to(Shuriken);

export { myContainer };
1
2
3
4
5
6
7
8
9
10
11
12
13

第四步:处理依赖关系

您可以使用容器类中的泛型方法 get<T> 来处理依赖关系。请注意,您应该仅在合成根中执行此类操作,从而避免服务定位器模式反转

import { myContainer } from "./inversify.config";
import { TYPES } from "./types";
import { Warrior } from "./interfaces";

const ninja = myContainer.get<Warrior>(TYPES.Warrior);

expect(ninja.fight()).eql("cut!"); // true
expect(ninja.sneak()).eql("hit!"); // true
1
2
3
4
5
6
7
8

于是我们就能够看到katana(太刀)shuriken(手里剑)成功注入到Ninja(忍者)这个类当中了。

InversifyJS 支持 ES5 和 ES6 并且并不一定要在 TypeScript 环境中。这里可以查看 JavaScript 的示例。

上次更新: 12/19/2019, 4:36:19 PM