Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

División de la Lógica del Reducer

En cualquier aplicación significativa, incluir toda tu lógica de actualización en una única función reducer rápidamente se volverá inmanejable. Si bien no hay una regla única sobre la longitud ideal de una función, existe consenso en que las funciones deben ser relativamente breves y hacer una única cosa específica. Por ello, es una buena práctica de programación dividir fragmentos de código muy extensos o que realizan múltiples tareas en partes más pequeñas y comprensibles.

Dado que un reducer de Redux es simplemente una función, este mismo principio se aplica. Puedes extraer parte de la lógica de tu reducer en otra función e invocarla desde la función principal.

Estas nuevas funciones suelen pertenecer a una de estas tres categorías:

Funciones utilitarias pequeñas que contienen fragmentos reutilizables de lógica necesarios en múltiples lugares (que pueden o no estar relacionados con la lógica de negocio específica)
Funciones para gestionar casos de actualización específicos, que frecuentemente requieren parámetros adicionales al par típico (state, action)
Funciones que manejan todas las actualizaciones para un segmento específico del estado. Estas generalmente sí mantienen la firma típica (state, action)

Para mayor claridad, utilizaremos estos términos para distinguir diferentes tipos de funciones y casos de uso:

reducer: cualquier función con la firma (state, action) -> newState (es decir, cualquier función que podría usarse como argumento de Array.prototype.reduce)
root reducer (reducer raíz): la función reducer que se pasa como primer argumento a createStore. Es la única parte de la lógica del reducer que debe tener la firma (state, action) -> newState.
slice reducer (reducer de segmento): un reducer que gestiona actualizaciones de una porción específica del árbol de estado, generalmente usado con combineReducers
case function (función de caso): función que maneja la lógica de actualización para una acción específica. Puede ser un reducer o requerir parámetros adicionales.
higher-order reducer (reducer de orden superior): función que recibe un reducer como argumento y/o devuelve un nuevo reducer (como combineReducers o redux-undo)

El término "sub-reducer" (sub-reducer) también se usa en discusiones para referirse a cualquier función que no sea el root reducer, aunque no es muy preciso. Algunos también denominan "business logic" (lógica de negocio) a funciones relacionadas con comportamientos específicos de la aplicación, o "utility functions" (funciones utilitarias) a funciones genéricas no específicas.

La descomposición de procesos complejos en partes más pequeñas y comprensibles se denomina descomposición funcional. Este concepto aplica a cualquier código, pero en Redux es muy común estructurar la lógica del reducer usando el enfoque #3, delegando actualizaciones por segmentos de estado. Redux denomina esto composición de reducers, siendo el enfoque más extendido. De hecho, es tan común que Redux incluye combineReducers(), que abstrae específicamente esta delegación por segmentos. Sin embargo, no es el único patrón posible: combinar los tres enfoques es totalmente viable y recomendable. La sección Refactorización de Reducers muestra ejemplos prácticos.