Git Product home page Git Product logo

inject-js's Introduction

inject-js

Build Status semantic-release Coveralls

一个极简的 TypeScript 依赖注入框架。https://searchfe.github.io/inject-js/

安装

使用 npm 来安装:

npm install --save @searchfe/inject-js

inject-js 需要 Reflect Metadata 来在运行时决定依赖类型,你的 tsconfig.json 需要包含以下的设置:

{
  "compilerOptions": {
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true
  }
}

另外因为该库依赖 Reflect 的使用,确保运行时存在 Reflect API 的 Polyfill,比如以下之一:

使用

以下是一些使用案例,更多细节请参考 API 文档

@injectable

@injectable 来装饰一个 Service,这样 inject-js 就可以(借由 metadata)得知它的依赖并在运行时注入。

// car.ts
import { injectable } from 'inject-js';
import { Wheel } from './wheel';

@injectable
export class Car {
    constructor(private wheel: Wheel) {}
}

// wheel.ts
import { injectable } from 'inject-js';

@injectable
export class Wheel {
    constructor() {}
}

// index.ts 应用入口
import { Container } from 'inject-js';
import { Car } from './car';
import { Wheel } from './wheel;

const di = new Container();
di.addService(Car);
di.addService(Wheel);
const car = di.create(Car);

@inject

@inject(token) 来装饰一个依赖(构造参数),来指定被注入的类。token 即为当前容器内 Provider 的唯一标识。 用于没有 Service 声明的场景(只有 Provider),或者没有 Metadata API 支持的场景。 也就是说借此可以在 JavaScript 代码中使用 inject-js。

import { inject } from 'inject-js';
import { Wheel } from './wheel';

@injectable
export class Car {
    constructor(@inject('Wheel') private wheel: Wheel) {}
}

// index.ts 应用入口
import { Container } from 'inject-js';
import { Car } from './car';
import { Wheel } from './wheel';

const di = new Container();
di.addService('Wheel', Wheel);
di.addService(Car);
const car = di.create(Car);

@service

如果 Container 实例就在定义 Service 的上下文中,可以用 @service 装饰器来直接注册:

const container = new Container();

@service(container)
class FooService {}

// 相当于:

const container = new Container();

@injectable
class FooService {}

container.addService(FooService)

Container

Container 会维护一个 Providers 集合,以及每个 Provider 对应的 Token。需要创建实例时,会根据 Token 查找对应的 Provider 并进行创建。 我们提供了如下几种注册 Provider 的方式:

  • .addProvider():注册一个具有 .create(): Service 方法的 Provider 类(工厂类),其余注册方式都是用 addProvider 实现的。
  • .addFactory():注册一个会返回 Service 实例的方法(工厂方法)。
  • .addService():注册一个具体的 Service 类。
  • .addValue():注册一个具体的值。

示例

在 demo 下包含了一个使用 inject-js 的示例。可以按以下步骤执行该示例:

  1. 进入 inject-js 项目根目录。
  2. 构建 inject-js:npm install && npm run build
  3. 执行 demo:npm run demo

inject-js's People

Contributors

biyingshuai avatar cheer4chai avatar harttle avatar semantic-release-bot avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.