Lección 4: Fundamentos del entorno de ejecución de JavaScript: Estrategia de refactorización

Explicación del concepto

"Fundamentos del entorno de ejecución de JavaScript: Estrategia de refactorización" trata de tomar código funcional y hacerlo más fácil de leer, cambiar y reutilizar. En esta lección, empezarás con una función pequeña, notarás dónde la intención se siente poco clara y la mejorarás sin cambiar el resultado. El enfoque no está en añadir funcionalidades primero. Está en nombrar bien las cosas, reducir la duplicación y separar la configuración del comportamiento para que el código se mantenga predecible a medida que crece. Al final, deberías poder explicar por qué una versión es más fácil de mantener que otra y detectar mejoras de refactorización sencillas en el JavaScript de todos los días.

Dónde poner el código

1. Empieza con variables y entradas. Usa la sintaxis de navegador o Node.js claramente.
2. Añade la lógica de procesamiento en la sección central.
3. Termina con la salida y una validación rápida.

Referencia de comandos

• Ejecuta la versión inicial una vez, luego renombra cualquier cosa que se sienta vaga o genérica.
• Extrae la lógica repetida de construcción de cadenas en una función auxiliar y confirma que la salida sigue siendo la misma.
• Compara las versiones original y refactorizada línea por línea para ver qué se volvió más fácil de leer.
• Explica una elección de refactorización en lenguaje sencillo, no solo en términos técnicos.

Guía paso a paso

1. Ejecuta el código tal como está escrito y anota la salida exacta antes de cambiar nada.
2. Subraya las partes que manejan el formato y las partes que manejan la configuración.
3. Refactoriza una pequeña parte, como un nombre, una función auxiliar o una expresión repetida.
4. Ejecuta la versión actualizada de nuevo y verifica que el comportamiento sigue coincidiendo con el original.
5. Termina con una breve lista de verificación: nombres más claros, misma salida, menos repetición, más fácil de reutilizar.

Ejercicios prácticos

• Refactoriza el `greeter` para que pueda producir mensajes tanto amigables como formales sin duplicar la plantilla de cadena.
• Crea un segundo `greeter` con un prefijo diferente y mantén el código fácil de escanear.
• Reescribe la solución con un estilo ligeramente diferente y explica qué versión mantendrías y por qué.

Retos de código

• Toma un script de saludo desordenado con lógica repetida y conviértelo en dos funciones pequeñas y enfocadas.
• Refactoriza el código para que un futuro desarrollador pueda cambiar la puntuación o la redacción en un solo lugar.

Mini tareas de práctica

• Renombra una variable para que su propósito sea obvio.
• Mueve una operación repetida a una función auxiliar.
• Escribe una frase describiendo qué parte del código se volvió más fácil de mantener.