当前位置：首页 > JavaScript

js ioc实现

2026-03-13 22:44:25JavaScript

实现 JavaScript 的 IOC（控制反转）

在 JavaScript 中实现 IOC（控制反转）通常依赖依赖注入（DI）模式，通过将依赖关系的创建和管理从组件内部转移到外部容器。以下是几种常见实现方式：

手动依赖注入

通过构造函数或属性显式注入依赖项，避免在组件内部直接实例化依赖对象。

class Logger {
  log(message) {
    console.log(message);
  }
}

class UserService {
  constructor(logger) {
    this.logger = logger;
  }

  getUser(id) {
    this.logger.log(`Fetching user ${id}`);
    return { id, name: 'John Doe' };
  }
}

const logger = new Logger();
const userService = new UserService(logger);
userService.getUser(1);

使用 IOC 容器

通过第三方库（如 inversify 或 awilix）管理依赖关系，自动解析和注入依赖。

使用 `inversify` 示例

import { Container, injectable, inject } from 'inversify';

@injectable()
class Logger {
  log(message) {
    console.log(message);
  }
}

@injectable()
class UserService {
  constructor(@inject('Logger') private logger) {}

  getUser(id) {
    this.logger.log(`Fetching user ${id}`);
    return { id, name: 'John Doe' };
  }
}

const container = new Container();
container.bind('Logger').to(Logger);
container.bind('UserService').to(UserService);

const userService = container.get('UserService');
userService.getUser(1);

基于装饰器的自动注入

通过装饰器（如 tsyringe）简化依赖注入的声明和解析。

import { container, injectable, inject } from 'tsyringe';

@injectable()
class Logger {
  log(message) {
    console.log(message);
  }
}

@injectable()
class UserService {
  constructor(@inject(Logger) private logger) {}

  getUser(id) {
    this.logger.log(`Fetching user ${id}`);
    return { id, name: 'John Doe' };
  }
}

const userService = container.resolve(UserService);
userService.getUser(1);

工厂模式实现

通过工厂函数动态创建依赖对象，实现控制反转。

js ioc实现

class Logger {
  log(message) {
    console.log(message);
  }
}

function createUserService(logger) {
  return {
    getUser(id) {
      logger.log(`Fetching user ${id}`);
      return { id, name: 'John Doe' };
    }
  };
}

const logger = new Logger();
const userService = createUserService(logger);
userService.getUser(1);