JavaScript轻量依赖注入实现教程

本文介绍了如何用原生 JavaScript 实现一个轻量、灵活且易于理解的依赖注入（DI）容器，涵盖从基础注册与解析机制、对常量/工厂函数/服务类的统一支持，到可选的单例模式优化，并通过清晰示例展示了其在真实场景（如日志服务与用户服务解耦）中的应用；它虽简洁，却完整体现了 DI 的核心思想——通过容器管理依赖生命周期以提升代码可测试性、可维护性与扩展性，特别适合初学者掌握原理或小型项目快速落地，同时为后续集成 TypeScript、配置化管理及主流框架打下坚实基础。

依赖注入（Dependency Injection, DI）是一种设计模式，用于解耦模块之间的依赖关系。通过一个容器来管理对象的创建和依赖注入，可以让代码更易于测试、维护和扩展。在 JavaScript 中，我们可以用一个简单的类来实现一个轻量级的依赖注入容器。

1. 定义依赖注入容器的基本结构

创建一个 Container 类，用来注册、解析和管理依赖。核心方法包括：

• register(key, resolver)：将依赖以键值对形式注册到容器中
• resolve(key)：根据键获取并实例化依赖

示例代码：

class Container {
  constructor() {
    this._registry = new Map();
  }

  register(key, resolver) {
    this._registry.set(key, resolver);
  }

  resolve(key) {
    if (!this._registry.has(key)) {
      throw new Error(`No dependency registered for key: ${key}`);
    }

    const resolver = this._registry.get(key);
    return typeof resolver === 'function' ? resolver(this) : resolver;
  }
}

2. 注册不同类型的依赖

支持注册常量值、工厂函数或服务类。容器会根据类型决定如何处理。

• 常量：直接存储值
• 工厂函数：调用函数时传入容器，便于内部 resolve 其他依赖

使用示例：

// 假设有两个服务
class Logger {
  log(msg) {
    console.log(`[LOG] ${msg}`);
  }
}

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

  createUser(name) {
    this.logger.log(`Creating user: ${name}`);
    return { id: Date.now(), name };
  }
}

// 使用容器注册
const container = new Container();

container.register('logger', () => new Logger());
container.register('userService', (container) => new UserService(container));

// 解析使用
const userService = container.resolve('userService');
userService.createUser('Alice');

3. 支持单例模式（可选优化）

某些服务应全局唯一，比如数据库连接或日志器。可以在注册时标记为单例，首次创建后缓存实例。

增强 register 方法：

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

  register(key, resolver, singleton = false) {
    this._registry.set(key, { resolver, singleton });
  }

  resolve(key) {
    if (!this._registry.has(key)) {
      throw new Error(`No dependency registered for key: ${key}`);
    }

    const { resolver, singleton } = this._registry.get(key);

    if (singleton && this._instances.has(key)) {
      return this._instances.get(key);
    }

    const value = typeof resolver === 'function' ? resolver(this) : resolver;
    if (singleton) {
      this._instances.set(key, value);
    }

    return value;
  }
}

注册单例服务：

container.register('logger', () => new Logger(), true);
container.register('userService', (container) => new UserService(container), true);

4. 实际应用场景建议

这种简易容器适合小型项目或学习理解 DI 原理。在实际开发中，你可以：

• 通过配置文件批量注册服务
• 添加依赖作用域（如请求级、应用级）
• 结合 TypeScript 提供类型提示
• 在框架中集成（如 Express 中间件注入）

基本上就这些。不复杂但容易忽略的是：确保依赖构造函数接收容器，以便内部能 resolve 其他服务。这样才真正实现自动装配。

好了，本文到此结束，带大家了解了《JavaScript轻量依赖注入实现教程》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多文章知识！