JavaScript依赖注入容器-js教程-PHP中文网

JavaScript依赖注入容器

betcha

发布： 2025-10-17 20:20:01

原创

843人浏览过

依赖注入是通过外部注入依赖实现控制反转，提升解耦与可测试性；文中给出构造函数注入示例及简易DI容器实现，支持单例与瞬时生命周期管理，最后介绍使用场景与成熟库InversifyJS。

javascript依赖注入容器

JavaScript中的依赖注入（Dependency Injection, DI）容器是一种设计模式工具，用于管理对象之间的依赖关系，提升代码的可测试性、可维护性和解耦程度。在大型应用中，手动创建和管理依赖容易导致代码混乱，而DI容器能自动解析并注入所需依赖。

什么是依赖注入？

依赖注入的核心思想是：不主动在类内部创建依赖实例，而是由外部将依赖“注入”进来。这样可以实现控制反转（Inversion of Control, IoC），让模块之间更加松耦合。

常见的注入方式包括：

构造函数注入：通过构造函数传入依赖
属性注入：将依赖赋值给对象属性
方法注入：通过方法参数传递依赖

为什么需要DI容器？

当项目变大，依赖层级加深时，手动管理依赖会变得繁琐且易错。DI容器的作用是：

立即学习“Java免费学习笔记（深入）”；

依图语音开放平台

查看详情

自动解析依赖树，按需创建实例
支持单例、瞬时等多种生命周期管理
集中注册和配置服务，便于维护
方便替换实现（如用mock替换真实服务进行测试）

一个简单的DI容器实现

下面是一个轻量级的DI容器示例，使用Map存储注册的服务，并支持构造函数注入：

class Container {
  constructor() {
    this.registry = new Map();
    this.instances = new Map(); // 缓存单例
  }

  register(name, ctor, lifecycle = 'singleton') {
    this.registry.set(name, { ctor, lifecycle });
    return this;
  }

  resolve(name) {
    if (!this.registry.has(name)) {
      throw new Error(`Service not registered: ${name}`);
    }

    const { ctor, lifecycle } = this.registry.get(name);

    if (lifecycle === 'singleton' && this.instances.has(name)) {
      return this.instances.get(name);
    }

    const instance = this._instantiate(ctor);
    
    if (lifecycle === 'singleton') {
      this.instances.set(name, instance);
    }

    return instance;
  }

  _instantiate(ctor) {
    const paramRegex = /constructor\s*\(\s*([^)]*)\)/;
    const argsStr = ctor.toString().match(paramRegex)?.[1] || '';
    const deps = argsStr.split(',').map(arg => arg.trim()).filter(Boolean);

    const dependencies = deps.map(dep => {
      if (!this.registry.has(dep)) {
        throw new Error(`Dependency not registered: ${dep}`);
      }
      return this.resolve(dep);
    });

    return Reflect.construct(ctor, dependencies);
  }
}

登录后复制

使用示例

假设我们有两个服务：Logger 和 UserService：

class Logger {
  log(msg) {
    console.log('[LOG]', msg);
  }
}

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

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

// 使用容器
const container = new Container();
container.register('Logger', Logger);
container.register('UserService', UserService);

const userService = container.resolve('UserService');
userService.getUser(1); // [LOG] Fetching user 1

登录后复制

基本上就这些。这个简易容器展示了DI的核心机制。实际项目中，也可以使用成熟的库，比如 InversifyJS，它支持装饰器、类型绑定和更复杂的场景，适合TypeScript项目。

以上就是JavaScript依赖注入容器的详细内容，更多请关注php中文网其它相关文章！