> Нужно ли мутировать массив товаров или создавать его копию для обновления состояния в React? (React)

В React состояние (state) должно быть иммутабельным. Это означает, что нельзя мутировать исходный массив товаров - вместо этого всегда нужно создавать его новую копию и обновлять состояние через setState.

Почему это важно:

• React использует поверхностное сравнение (shallow comparison) для определения изменений. Если вы мутируете массив, ссылка на объект остаётся той же, и React может не заметить обновление, что приведёт к отсутствию ререндера.

• Иммутабельность упрощает отладку и предотвращает побочные эффекты, особенно при работе с хуками (useState, useReducer) и мемоизацией (useMemo, useCallback).

Пример правильного подхода:

JSX
// ❌ Плохо: мутация
const handleUpdate = (id, newPrice) => {
  const item = items.find(item => item.id === id);
  item.price = newPrice; // мутация
  setItems(items); // React может не обновить UI
};

// ✅ Хорошо: создание копии
const handleUpdate = (id, newPrice) => {
  setItems(prevItems =>
    prevItems.map(item =>
      item.id === id ? { ...item, price: newPrice } : item
    )
  );
};

Инструменты для удобства:

• Для простых массивов - map, filter, slice, spread-оператор ([...items]).

• Для глубоких вложенностей - Immer (через useImmer), который позволяет писать мутабельный код, но под капотом создаёт иммутабельные копии.

Исключение: Если массив не является частью состояния (например, локальная переменная в компоненте), мутация допустима, но в контексте React-состояния - всегда копия.