|
| 1 | +# Refactorización de código orientado a eventos en JavaScript |
| 2 | + |
| 3 | +La refactorización es el proceso de mejorar la estructura y el diseño del código sin cambiar su funcionamiento. El objetivo es hacer que el código sea más limpio, fácil de entender y sencillo de mantener. Esto no significa añadir nuevas funciones o corregir errores, sino organizar mejor el código para que sea más eficiente y escalable. |
| 4 | + |
| 5 | +La refactorización en los sistemas de streaming garantiza que los componentes que gestionan el procesamiento de datos en tiempo real sean eficientes, flexibles y fáciles de mantener a lo largo del tiempo. A medida que los sistemas de streaming se amplían, un código mal estructurado puede convertirse en un obstáculo, lo que provoca una degradación del rendimiento o dificultades para añadir nuevas funciones. Mediante la refactorización, los desarrolladores pueden optimizar los flujos de datos, mejorar la utilización de los recursos y simplificar la depuración y la supervisión, lo que garantiza que los sistemas de streaming sigan siendo fiables incluso cuando aumentan los volúmenes de datos. |
| 6 | + |
| 7 | +En este contexto, la refactorización no solo ayuda a los desarrolladores a mantener un código limpio, sino que también respalda la escalabilidad y la fiabilidad de toda la arquitectura de streaming, lo que la convierte en una práctica crucial en entornos con un uso intensivo de datos. |
| 8 | + |
| 9 | +--- |
| 10 | + |
| 11 | +## La importancia de la refactorización |
| 12 | + |
| 13 | +### Mantener un código limpio |
| 14 | +En cualquier proyecto de software de gran envergadura, el código limpio se refiere a un código bien estructurado, legible y fácil de mantener que se ajusta a las mejores prácticas, lo que facilita su depuración, ampliación y optimización a lo largo del tiempo. |
| 15 | + |
| 16 | +### Mejora de la depuración y el mantenimiento |
| 17 | +Un código bien escrito permite a los ingenieros identificar y solucionar rápidamente los cuellos de botella, lo que ayuda a minimizar el tiempo de inactividad o los retrasos en la transmisión de datos. Cuando se procesan grandes volúmenes de datos, incluso una pequeña ineficiencia en el código puede provocar retrasos o sobrecargar los recursos, por lo que un código limpio ayuda a evitar estos problemas. |
| 18 | + |
| 19 | +### Utilización eficiente de los recursos |
| 20 | +In cloud environments, where you are billed based on resource usage, writing clean, efficient code minimizes the overhead and ensures that your system uses resources (e.g., compute and storage) effectively. Efficient pipelines are able to process more data with fewer compute resources, reducing operational costs while maintaining performance. |
| 21 | + |
| 22 | +### Reducir la deuda técnica |
| 23 | +En su prisa por ofrecer nuevas funciones, los equipos suelen hacer concesiones que acumulan deuda técnica, es decir, el costo de corregir posteriormente un código que no es óptimo. La refactorización periódica es la forma de saldar esta deuda antes de que se salga de control. |
| 24 | +En los sistemas de streaming, la deuda técnica puede manifestarse en forma de partición ineficiente de temas, esquemas mal diseñados o lógica de procesamiento de eventos engorrosa. En el contexto de los sistemas de streaming, la deuda técnica puede manifestarse de varias maneras, como una partición ineficiente de temas, esquemas mal diseñados y una lógica de procesamiento de eventos inadecuada. |
| 25 | + |
| 26 | +--- |
| 27 | + |
| 28 | +## Técnicas de Refactorización |
| 29 | + |
| 30 | +### Método de extracción |
| 31 | +Cuando un bloque de código realiza demasiadas tareas a la vez, resulta difícil seguirlo y mantenerlo. El **método de extracción** consiste en tomar parte de ese código y moverlo a su propia función o método. Cada nuevo método debe tener un nombre claro y descriptivo basado en lo que hace. Este enfoque hace que el código esté más organizado, sea más fácil de entender y más fácil de probar. |
| 32 | + |
| 33 | +#### Ejemplo |
| 34 | + |
| 35 | +**Antes de la refactorización** |
| 36 | +```javascript |
| 37 | +function procesarPedido(pedido) { |
| 38 | + console.log("Procesando pedido de " + pedido.cliente); |
| 39 | + |
| 40 | + // Calcular total |
| 41 | + let total = 0; |
| 42 | + for (let i = 0; i < pedido.items.length; i++) { |
| 43 | + total += pedido.items[i].precio * pedido.items[i].cantidad; |
| 44 | + } |
| 45 | + console.log("Total: $" + total); |
| 46 | + |
| 47 | + // Enviar confirmación |
| 48 | + console.log("Enviando confirmación a " + pedido.cliente); |
| 49 | +} |
| 50 | +``` |
| 51 | +**Problema:** |
| 52 | +El cálculo del total está dentro de la función y mezcla responsabilidades. |
| 53 | +Esto hace que el código sea menos claro y difícil de reutilizar en otros lados. |
| 54 | + |
| 55 | +**Después de la refactorización (Extracción)** |
| 56 | +```javascript |
| 57 | +function calcularTotal(items) { |
| 58 | + let total = 0; |
| 59 | + for (let i = 0; i < items.length; i++) { |
| 60 | + total += items[i].precio * items[i].cantidad; |
| 61 | + } |
| 62 | + return total; |
| 63 | +} |
| 64 | + |
| 65 | +function procesarPedido(pedido) { |
| 66 | + console.log("Procesando pedido de " + pedido.cliente); |
| 67 | + |
| 68 | + const total = calcularTotal(pedido.items); |
| 69 | + console.log("Total: $" + total); |
| 70 | + |
| 71 | + console.log("Enviando confirmación a " + pedido.cliente); |
| 72 | +} |
| 73 | +``` |
| 74 | +### Cambiar el nombre de las variables |
| 75 | +Los nombres adecuados para las variables son esenciales para que el código sea legible. |
| 76 | +Durante la refactorización, es posible que encuentres que algunas variables tienen nombres vagos o confusos. |
| 77 | +Por ejemplo, usar un nombre como x o datos no proporciona suficiente información sobre lo que representa la variable. |
| 78 | +**Cambiar el nombre de estas variables** por algo más descriptivo, como costoTotal o datosDelCliente, ayudará a cualquiera que lea el código a entenderlo más fácilmente. |
| 79 | +#### Ejemplo |
| 80 | + |
| 81 | +**Antes de la refactorización** |
| 82 | +```javascript |
| 83 | + |
| 84 | + function calcular(d, t) { |
| 85 | + return d / t; |
| 86 | +} |
| 87 | + |
| 88 | +let r = calcular(100, 2); |
| 89 | +console.log("Resultado: " + r); |
| 90 | +``` |
| 91 | +**Problema:** |
| 92 | +**d**, **t** y **r** no dicen mucho sobre su propósito. |
| 93 | +Otro programador tendría que leer toda la función para entender que son distancia, tiempo y velocidad. |
| 94 | + |
| 95 | +**Después de la refactorización** |
| 96 | +```javascript |
| 97 | + function calcularVelocidad(distancia, tiempo) { |
| 98 | + return distancia / tiempo; |
| 99 | + } |
| 100 | + |
| 101 | + let velocidad = calcularVelocidad(100, 2); |
| 102 | + console.log("Velocidad: " + velocidad + " km/h"); |
| 103 | +``` |
| 104 | + |
| 105 | +### Simplificar las condiciones |
| 106 | +Las sentencias condicionales complejas (como las sentencias **if** o **switch**) pueden dificultar la lectura y comprensión del código. |
| 107 | +La refactorización de estas sentencias condicionales puede implicar varias técnicas. |
| 108 | + |
| 109 | +#### Ejemplo |
| 110 | + |
| 111 | +**Antes de la refactorización** |
| 112 | +```javascript |
| 113 | +function puedeVotar(edad, esCiudadano) { |
| 114 | + if (edad >= 18) { |
| 115 | + if (esCiudadano === true) { |
| 116 | + return true; |
| 117 | + } else { |
| 118 | + return false; |
| 119 | + } |
| 120 | + } else { |
| 121 | + return false; |
| 122 | + } |
| 123 | +} |
| 124 | + |
| 125 | +console.log(puedeVotar(20, true)); // true |
| 126 | +console.log(puedeVotar(16, true)); // false |
| 127 | +``` |
| 128 | + |
| 129 | +**Problema:** |
| 130 | +Hay ifs anidados innecesarios. |
| 131 | +El código es más largo y menos legible. |
| 132 | + |
| 133 | +**Después de la refactorización** |
| 134 | +```javascript |
| 135 | + function puedeVotar(edad, esCiudadano) { |
| 136 | + return edad >= 18 && esCiudadano; |
| 137 | + } |
| 138 | + |
| 139 | + console.log(puedeVotar(20, true)); // true |
| 140 | + console.log(puedeVotar(16, true)); // false |
| 141 | +``` |
| 142 | + |
| 143 | +### Referencia APA |
| 144 | +Refactoring (code): Everything you need to know. (s/f). Confluent. Recuperado el 19 de septiembre de 2025, de https://www.confluent.io/learn/refactoring/ |
0 commit comments