В чем разница между Dependency Injection и Service Locator?

Dependency Injection vs Service Locator

В архитектуре приложений Dependency Injection (DI) и Service Locator — это два подхода к управлению зависимостями. Хотя оба решают проблему получения нужных объектов, они имеют принципиально разные философии и последствия для кода.

Dependency Injection (Внедрение зависимостей)

Dependency Injection — это паттерн, при котором зависимости передаются в компонент извне, обычно через конструктор, параметры функции или пропсы React.

// Зависимость UserService передается через параметр
function UserComponent({ userService }) {
  const [user, setUser] = React.useState(null);
  
  React.useEffect(() => {
    userService.getUser().then(setUser);
  }, [userService]);
  
  return <div>{user?.name}</div>;
}

// Использование
const userService = new UserService();
<UserComponent userService={userService} />

Преимущества DI:

1. Явность и читаемость
   • Сразу видно, какие зависимости нужны компоненту
   • Нет скрытых зависимостей
   • Легче понять граф зависимостей

// Ясно, что нужны userService и analyticsService
function Dashboard({ userService, analyticsService }) {
  // ...
}

1. Простота тестирования
   • Легко передать mock объект вместо реального сервиса
   • Не нужна глобальная конфигурация

test('UserComponent fetches user on mount', () => {
  const mockUserService = {
    getUser: jest.fn().mockResolvedValue({ id: 1, name: 'Alice' })
  };
  
  render(<UserComponent userService={mockUserService} />);
  expect(mockUserService.getUser).toHaveBeenCalled();
});

1. Гибкость

   • Разные реализации сервисов для разных контекстов
   • Легко заменить реализацию

2. Разрешение циклических зависимостей

   • DI контейнер может правильно управлять порядком инициализации

Service Locator

Service Locator — это глобальный объект (реестр), который знает как создавать и получать сервисы по имени.

// Глобальный Service Locator
class ServiceLocator {
  static services = {};
  
  static register(name, service) {
    this.services[name] = service;
  }
  
  static get(name) {
    return this.services[name];
  }
}

// Регистрация
ServiceLocator.register('userService', new UserService());

// Использование
function UserComponent() {
  const userService = ServiceLocator.get('userService');
  
  const [user, setUser] = React.useState(null);
  
  React.useEffect(() => {
    userService.getUser().then(setUser);
  }, []);
  
  return <div>{user?.name}</div>;
}

Преимущества Service Locator:

1. Удобство

   • Не нужно передавать зависимости через пропсы
   • Упрощает работу с глубоко вложенными компонентами

2. Меньше бойлерплейта

   • Не нужно прокидывать зависимости через каждый уровень компонентов

Недостатки Service Locator

1. Скрытые зависимости
   • Не ясно, какие сервисы нужны компоненту
   • Нужно читать весь код, чтобы понять зависимости

// Неясно, какие зависимости нужны
function UserComponent() {
  const userService = ServiceLocator.get('userService');
  const analyticsService = ServiceLocator.get('analyticsService');
  const notificationService = ServiceLocator.get('notificationService');
  // ...
}

1. Сложность тестирования
   • Нужно мокировать глобальный Service Locator
   • Возможны побочные эффекты между тестами
   • Трудно изолировать компоненты

test('UserComponent', () => {
  const mockUserService = { getUser: jest.fn() };
  // Нужно изменить глобальный объект
  ServiceLocator.register('userService', mockUserService);
  // Опасно: может повлиять на другие тесты
});

1. Меньше контроля

   • Сложнее управлять жизненным циклом объектов
   • Service Locator сам решает, когда создавать объекты

2. Анти-паттерн

   • Большинство экспертов (включая Мартина Фаулера) считают Service Locator анти-паттерном
   • Создает неявные зависимости

Comparison Table

Практический пример в React

С DI (рекомендуемый подход):

// Context API для DI
const ServiceContext = React.createContext();

function App() {
  const services = {
    userService: new UserService(),
    analyticsService: new AnalyticsService()
  };
  
  return (
    <ServiceContext.Provider value={services}>
      <Dashboard />
    </ServiceContext.Provider>
  );
}

function Dashboard() {
  const services = React.useContext(ServiceContext);
  return <UserComponent userService={services.userService} />;
}

function UserComponent({ userService }) {
  // userService явно передана
}

С Service Locator (менее предпочтительный подход):

function App() {
  ServiceLocator.register('userService', new UserService());
  ServiceLocator.register('analyticsService', new AnalyticsService());
  
  return <Dashboard />;
}

function Dashboard() {
  return <UserComponent />;
}

function UserComponent() {
  const userService = ServiceLocator.get('userService');
  // userService получена из глобального реестра
}

Рекомендация для интервью

"Dependency Injection предпочтительнее, потому что:

1. Делает зависимости явными
2. Упрощает тестирование
3. Обеспечивает лучший контроль над объектами
4. Облегчает поддержку кода

Service Locator проще использовать на первый взгляд, но создает скрытые зависимости и усложняет тестирование. В React используй Context API или пропсы для DI, это будет более поддерживаемым кодом."