npm 包 inversify 使用教程-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，我们很少能独立完成整个的项目，我们经常采用不同的第三方库来助力项目的开发。npm 就是一个很好的本地依赖管理工具，可以轻松地引入第三方库。

这篇文章将向您介绍一款 npm 包 inversify，这是一款针对 TypeScript 应用的轻量级和可扩展的依赖注入容器。

什么是 inversify

Inversify 是一个 TypeScript 应用的轻量级、可扩展的依赖注入容器。该库可以大幅简化复杂应用的开发。注入来自不同模块的依赖项可以使代码更具模块化，更容易测试和重构。

如何使用 inversify

步骤 1：安装 inversify

您可以使用 npm 安装 inversify：

npm install inversify reflect-metadata --save

这里 reflect-metadata 包用于执行实现反射元数据的模块。我们可以使用 inversify/dts/inversify 导入 inversify 库的 TypeScript 类型声明。导入后，我们就可以实例化容器并使用注入的依赖了。

步骤 2：创建 Typescript 类

首先，我们创建一个简单的 TypeScript 类。

-- -------------------- ---- -------
----- --- -
    ------- ------ -------
    ----------------- ------- -
        ---------- - -----
    -
    ------ ---------- ------ -
        ------ -----------
    -
-

步骤 3：创建 inversify 容器

接下来，我们实例化一个容器，并通过 .bind() 注册我们的依赖项。

import { Container } from 'inversify';
import 'reflect-metadata';
import { Car } from './Car'; // 导入我们在步骤 2 创建的类

let container = new Container();

container.bind<Car>('Car').to(Car);        // 因为我们要使用 Car 类，所以我们将其绑定至容器

借助 bind() 方法，我们将 Car 类型绑定到与字符串 “Car” 匹配的标识符上。

步骤 4：使用依赖注入

在容器中添加依赖项后，我们可以通过获取容器的实例来使用依赖注入。

使用构造函数注入

在这里，我们使用类的构造函数来注入依赖项。

-- -------------------- ---- -------
----- ------ -
    ------- ----- ----
    -------------------------- ---- ---- -
        --------- - ----
    -
    ------ ------------- ------ -
        ------ --------------------
    -
-

我们可以看到，我们使用了 inject('Car') 装饰器将 Car 类型与字符串 Car 关联。

接下来，通过 container.get<Driver>('Driver') 获取 Driver 类型的一个实例，Driver 类型的构造函数将自动调用并使用 Car 类型的一个实例作为它的参数。

// ...
import { Driver } from './Driver';

container.bind<Driver>('Driver').to(Driver);

let driver = container.get<Driver>('Driver');
console.log(driver.getCarType());    // 输出： "Type of Car"

这样我们就成功地使用 inversify 容器注入了 Car，并向 Driver 类型的构造函数注入实例。

使用属性注入

我们也可以使用属性注入来注入依赖项。注入由 inversify 在运行时完成，并且可以通过“反射元数据”类型信息来实现。

class Driver {
    @inject('Car') private _car: Car;
    public getCarType(): string {
        return this._car.getType();
    }
}

您可以通过相同的方式创建注入，然后从 inversify 容器获取实例。

// ...
import { Driver } from './Driver';

container.bind<Driver>('Driver').to(Driver);

let driver = container.get<Driver>('Driver');
console.log(driver.getCarType());    // 输出： "Type of Car"

注册和实例化单例

使用 inversify，我们可以轻松地在容器中注册单例并重用它们。只需传入标识符和工厂函数/类即可。我们也可以使用 .inSingletonScope() 将类型绑定为单例。例如：

container.bind<MyService>('MyService').to(MyServiceImpl).inSingletonScope();

总结

通过本文，您应该已经掌握了 inversify 的一些基础使用方法。在实际应用中，它能够大幅简化复杂应用的开发。注入来自不同模块的依赖项可以使代码更具模块化，更容易测试和重构。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/57861