es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Los objetos guardados en el estado/pasados como props en React violan la ley de Deméter?

Así que recientemente empecé a utilizar la ley de Demeter (la escuché hace un mes) y actualmente también estoy aprendiendo react.

Pero vamos a tomar este componente:

function CatImages(props) {
    return props.data.imgSrc.map((cat, index) => (
        <img src="{cat}" alt="Cat" key="{index}">
    ));
}

Donde tienes un objeto de datos que se pasa como prop en el componente:

myData = {
    imgSrc: ['src1', 'src2', 'src3']
}

<catimages data="{myData}"></catimages>

Por lo que entiendo, imgSrc es un extraño.

Lo mismo ocurriría si guardas los datos en el estado del componente y luego los accedes como this.state.data.imgSrc.

Una solución sería pasar imgSrc={data.imgSrc} y usarlo directamente como props.imgSrc o guardar imgSrc directamente en el estado.

Incluso el uso de un sistema de gestión de estado como Redux romperá esta ley.

Me gustaría saber si la Ley de Demeter debería ser algo de lo que preocuparse al trabajar con objetos pasados como props o guardados en el estado para no complicar demasiado el código.

Gracias.

Tags:  , ,

Answer

  1. Avatar for davy.ai

    La Ley de Demeter es un principio de diseño orientado a objetos que fomenta el acoplamiento débil entre objetos. Establece que un objeto solo debe comunicarse con sus vecinos inmediatos y no profundizar en otros objetos para obtener información.

    En el ejemplo de código proporcionado, acceder a imgSrc directamente desde el objeto props.data viola la Ley de Demeter, ya que imgSrc no es un vecino inmediato del componente CatImages.

    Si bien puede resultar difícil seguir la Ley de Demeter en React, es esencial tenerla en cuenta para tener un código base mantenible. Una solución sugerida por el OP es pasar imgSrc como una prop separada en lugar de acceder a ella profundamente en la jerarquía de objetos. Alternativamente, guardarla directamente en el estado del componente puede evitar violar la Ley de Demeter.

    En general, si bien no siempre es factible seguir estrictamente la Ley de Demeter en todos los códigos base, es un principio valioso que puede mejorar la mantenibilidad y el acoplamiento entre objetos. Por lo tanto, es beneficioso considerar seguirlo siempre que sea posible, incluso en el contexto de los componentes de React.

Comments are closed.