> Какие архитектурные шаблоны существуют (JavaScript)

Короткий ответ

Архитектурные шаблоны - это проверенные решения для организации кода и взаимодействия между компонентами. Основные: MVC (Model-View-Controller), MVP (Model-View-Presenter), MVVM (Model-View-ViewModel), Flux/Redux (однонаправленный поток данных), модульный шаблон (модули с инкапсуляцией), микросервисная архитектура (для бэкенда), event-driven и layered architecture. Выбор зависит от масштаба проекта, требований к тестируемости и сложности бизнес-логики.

Подробное объяснение

Архитектурные шаблоны решают проблему организации кода на уровне приложения, а не отдельных функций. Для frontend-разработки на JavaScript/Node.js актуальны:

• MVC - разделение на модель (данные/бизнес-логика), представление (UI) и контроллер (обработка ввода). Классика для серверного рендеринга, но на фронтенде часто приводит к "толстым" контроллерам.
• MVP - вариант MVC, где Presenter управляет логикой, а View пассивно отображает данные. Упрощает тестирование, так как View можно замокать.
• MVVM - популярен в Angular и Vue через двустороннее связывание данных. ViewModel автоматически синхронизирует состояние с View, уменьшая boilerplate.
• Flux/Redux - однонаправленный поток данных: action → dispatcher → store → view. Решает проблему предсказуемости состояния в сложных UI. Redux - самая распространённая реализация.
• Модульный шаблон - инкапсуляция через IIFE или ES modules. Каждый модуль имеет чёткую ответственность и явные зависимости.
• Event-driven - компоненты общаются через события (EventEmitter, pub/sub). Используется в Node.js (EventEmitter) и для слабосвязанных систем.
• Layered architecture - разделение на слои (например, presentation, business logic, data access). Хорошо подходит для Node.js-приложений с Express/Koa.

На практике

Для frontend-приложений на JavaScript чаще всего комбинируют шаблоны. React использует компонентный подход с однонаправленным потоком (Flux-подобный через Redux или Context API). Vue и Angular - MVVM с реактивностью. В Node.js популярна layered architecture: маршруты → middleware → контроллеры → сервисы → репозитории.

При выборе шаблона учитывай:

• Масштаб - для простых страниц хватит модульного подхода, для SPA нужен Flux/Redux.
• Тестируемость - MVP и MVVM легче тестировать, чем MVC.
• Сложность бизнес-логики - чем сложнее, тем больше нужна чёткая слоистая архитектура.
• Командная работа - строгие шаблоны (Redux, layered) упрощают онбординг.

Пример кода

JAVASCRIPT
// Flux-подобный шаблон с Redux
// Action
const ADD_TODO = 'ADD_TODO';
const addTodo = (text) => ({ type: ADD_TODO, payload: text });

// Reducer
const todosReducer = (state = [], action) => {
  switch (action.type) {
    case ADD_TODO:
      return [...state, { id: Date.now(), text: action.payload, completed: false }];
    default:
      return state;
  }
};

// Store
const store = createStore(todosReducer);

// View (React component)
const TodoList = () => {
  const todos = useSelector(state => state);
  const dispatch = useDispatch();
  
  return (
    <ul>
      {todos.map(todo => <li key={todo.id}>{todo.text}</li>)}
      <button onClick={() => dispatch(addTodo('New task'))}>Add</button>
    </ul>
  );
};

Как отвечать на собеседовании

Начни с краткого определения и перечисли основные шаблоны. Затем выбери 2-3 наиболее релевантных для твоей специализации (frontend/Node.js) и объясни их trade-off. Приведи пример из реального проекта, где ты применял шаблон и почему. Если спросят про конкретный шаблон, опиши его структуру, преимущества и недостатки. Не пытайся перечислить все шаблоны - лучше глубоко раскрыть несколько.

Что проверяет интервьюер

• Понимание разницы между архитектурным шаблоном и паттерном проектирования (например, MVC vs Singleton).
• Умение выбирать шаблон под задачу, а не использовать везде один.
• Знание конкретных реализаций в JavaScript/Node.js (Redux, EventEmitter, модули).
• Понимание trade-off: тестируемость, производительность, сложность поддержки.
• Опыт применения на практике, а не только теория.

Типичные ошибки

• Путать архитектурные шаблоны с паттернами проектирования (например, называть Singleton архитектурным шаблоном).
• Называть только MVC, игнорируя современные подходы (Flux, MVVM).
• Не упоминать контекст - для чего шаблон подходит, а для чего нет.
• Приводить примеры только из учебников, без реального опыта.
• Забывать про Node.js - для серверной части актуальны layered и event-driven шаблоны.