• Saltar a la navegación principal
  • Saltar al contenido principal

Galatar

Programación Web de cero a infinito

  • Inicio
  • Acerca de
Usted está aquí: Inicio / Herramientas / Como refactorizar y formatear tu código en Visual Studio Code

Como refactorizar y formatear tu código en Visual Studio Code

24 agosto 2019 by Juanan Ruiz Dejar un comentario

Las herramientas para refactorizar y formatear código en Visual Studio Code están un poco escondidas o necesitan la instalación de alguna extensión para poder usar estas opciones en lenguaje PHP. En este artículo verás lo fácil que es configurarlas y empezar a usarlas en un periquete.

Refactorizar código

Una de las tareas de refactorización más sencillas, más frecuentes y más recomendables es la de cambiar el nombre a variables, funciones y clases por otros más adecuados.

Hay un comando muy útil para esto que es la búsqueda y reemplazo global (utilizando el atajo de teclado shift+cmd+F en Mac o shift+ctrl+ F en Linux o Windows). El problema de este método es que puede haber variables con el mismo nombre en otra parte del código y en otro contexto que se verán afectadas también por el cambio de manera indeseada (yo me he cargado una instalación de WordPress entera con este comando) o que olvides poner la búsqueda exacta y al sustituir $post te cambie también $postcard, $postman, etc.

Una manera menos arriesgada de hacerlo es utilizar el atajo cmd+F2 o ctrl+F2 que selecciona todas las apariciones del método de manera exacta, para ello seleccionas el elemento que quieres reemplazar y pulsas el atajo. Si se te olvida el atajo recuerda que puedes llamarlo también con el botón secundario del ratón y en el menú contextual seleccionas “Change all ocurrences”. Con esto además no haces la sustitución de golpe, sino que te aparece un cursor múltiple que te permite moverte por todas las apariciones de la palabra a la vez, borrar, escribir, etc. Pruébalo, es adictivo.

Reemplazo múltiple en Visual Studio Code

Un efecto parecido se puede conseguir situándote sobre una palabra y pulsando cmd+D o ctrl+D. Cada vez que pulses esta combinación se irán marcando las siguientes apariciones pero de una en una. Resulta de mucha utilidad si estás copiando un fragmento de código o de HTML que se repite pero en el que cambian un par de variables, muy típico cuando estás creando campos en un formulario, en este caso no quieres cambiar todo, sino sólo las dos o tres últimas apariciones que acabas de pegar, te pongo un ejemplo animado para que lo veas mejor.

Reemplazar tras pegar elementos del formulario

Extraer funciones

Otra de las opciones más potentes para mejorar tu código y propiciar la reutilización de código es convertir fragmentos relacionados de código en funciones, aunque no es tan potente como los que he visto en otros IDE (e incluso en otros lenguajes dentro de VSCode) puedes instalar la extensión PHP Refactor de @RogerioPradoJ

Tras instalar esta extensión seleccionar el código que quieres pasar a función, abre la Paleta de comandos (Command Palette) (shift+cmd+P / shift+ctrl+P) y teclea Extract Function para que te genere una nueva función con los parámetros que necesita y el código que estás refactorizando. Una vez generada la función debes cambiarle el nombre que la herramienta proporciona por defecto, colocarla en un sitio adecuado y hacer la llamada a la función en el lugar donde antes estaba el código original.

Formatear el código

Si te encuentras con un código mal formateado y difícil de leer, o al terminar de teclear tu código quieres asegurarte que todo se encuentra correctamente formateado te recomiendo utilizar alguna extensión para hacer esto de manera automática. Para PHP he probado la extensión phpfmt – PHP formatter de kokororin que te ajusta correctamente todas las tabulaciones, espaciados, colocación de llaves, etc.

Sigue los estándares PSR y tiene opciones para activar o desactivar todas las transformaciones que puede realizar.
Una vez instalada la extensión utiliza el botón secundario del ratón y selecciona “Format Document” o “Format Selection”.

Archivado en: Herramientas Etiquetado con: refactorizar, visual studio code




Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Copyright © 2022 · Aspire Pro on Genesis Framework · WordPress · Iniciar sesión