Ejecutar Javascript paso a paso en Visual Studio Code: JavaScript debugger

Si estás buscando una forma de ejecutar Javascript paso a paso, este es el post para ti. Hoy veremos cómo podemos usar algunas funciones o configuraciones especiales de Visual Studio code para poder correr nuestro código de Javascript paso a paso.

Es importante conocer diferentes formas de ejecución ya que, cuando tenemos códigos extensos, necesitamos organización para ver qué es lo que ocurre y en qué lugar.

Posiblemente ya te has topado con este problema, como yo, pero ejecutar JavaScript paso a paso mejora mucho el razonamiento o lógica del código que estás realizando. Así mismo, podemos resolver o encontrar caminos más rápido.

Antes de iniciar, recuerda que te dejo un video al final para guiarte mejor en el proceso.

Ejecutar paso a paso

Javascript paso a paso
Qué es una API: endpoint, ruta, parámetro y autenticación

Si est√°s iniciando en el desarrollo o programaci√≥n, en alg√ļn momento tendr√°s que conocer qu√© es una ‚Ķ

Qué es bootstrap y cómo usar: formularios, botones, colores y más

Si est√°s buscando ser m√°s eficiente y eficaz en tu c√≥digo, con el dise√Īo de tu web o front end, usar‚Ķ

git remote: cómo funciona la conexión de repositorios

Aprender a conectar nuestro código con repositorios externos es clave para una buena ejecución y git…

Para ejecutar Javascript paso a paso vamos a necesitar b√°sicamente tres cosas:

  • c√≥digo para ejecutar.
  • Punto de ejecuci√≥n.
  • configurar visual studio para correr paso a paso

Código

Entonces para lo primero, tengo el siguiente código. Crearé un arreglo vacío el cual se irá llenando por medio de un for y .push:

var arreglo = []; // arreglo vacío

for( var i = 0; i < 10; i++){
    arreglo.push(i); // agregar el valor a la √ļltima posici√≥n.
}

console.log(arreglo); // mostrar el arreglo

Punto de ejecución paso a paso

Punto de ejecución javascript en vscode

Ahora, el segundo paso es seleccionar un punto de ejecuci√≥n. En el lado izquierdo del n√ļmero de l√≠nea, haz click y ver√°s un punto rojo. Este debe ser un punto clave en tu c√≥digo, por ejemplo al inicio o en medio del for anterior.

Configurar visual studio code

Run and debug – Node.js

Una ves terminado el c√≥digo, en la parte izquierda ver√°s el s√≠mbolo run and debug. Haz click y luego selecciona nuevamente run and debug. Se abrir√° un men√ļ de opciones, de las cuales puedes seleccionar Node.js.

Al hacer click ver√°s el men√ļ disponible para ver la ejecuci√≥n paso a paso.

Para usarlo, solo haz click en la flecha hacia abajo y podrás ver en la parte izquierda como las variables van tomando sus valores, así hasta llegar a la concusión del código.

Video de ayuda

Hice este video para ayudarte en el proceso. Si te gusta no olvides dar like y suscribirte para nuevos videos.

Ejecuta js paso a paso – youtube

Producto sugerido

Si al igual que yo, pasas demasiado tiempo en un pc, puede que este producto te ayude, como yo a cuidar mis manos y a su vez, optimizar mis horas de digitalización.

Te recomiendo totalmente este teclado mec√°nico Keychron k6. Si quieres ver la rese√Īa completa puedes hacerlo aqu√≠.

keychron k6 – 490 valoraciones

Keychron K6 65% compacto teclado mecánico inalámbrico para Mac, retroiluminación blanca, Bluetooth, multitarea, tipo C con cable teclado para Windows con interruptor marrón Gateron

  • El Keychron K6 es un teclado mec√°nico inal√°mbrico Bluetooth compacto de 65 % con retroiluminaci√≥n blanca hecha para Mac y Windows. El K6 est√° dise√Īado para maximizar tu espacio de trabajo y mejorar la productividad.
  • Con un dise√Īo √ļnico de Mac, compatibilidad con Windows y teclas de flecha dedicadas, el K6 ofrece una c√≥moda accesibilidad a todas las teclas multimedia y funciones esenciales a trav√©s de la combinaci√≥n de pulsaciones de teclas, pero lo suficientemente compacto para que puedas llegar a tu rat√≥n m√°s f√°cilmente. Teclas adicionales para sistemas operativos Windows y Mac est√°n incluidas.
  • Se conecta con hasta 3 dispositivos a trav√©s del fiable chipset Broadcom Bluetooth 5.1 y cambia entre ellos f√°cilmente para necesidades multitarea. El K6 es mejor para adaptarse al hogar, la oficina y el uso de juegos ligeros mientras se conecta con tu smartphone, port√°til y iPad. Tambi√©n tiene modo con cable con conexi√≥n USB tipo C.

VER EN AMAZON

Conclusión

Ejecutar nuestro código JS paso a paso es recomendable ya sea que estemos iniciando o ya llevemos un tiempo programando. Conocer la ejecución va a acelerar el aprendizaje y resolución del código en general!

¬ŅDe cu√°nta utilidad te ha parecido este contenido?

¬°Haz clic en una estrella para puntuar!

Promedio de puntuación 0 / 5. Recuento de votos: 0

Hasta ahora, ¡no hay votos!. Sé el primero en puntuar este contenido.

Ya que has encontrado √ļtil este contenido...

¡Sígueme en los medios sociales!

Resumen
Ejecutar javascript paso a paso | Run and Debug | Correr JS VSCode ūüöÄ
Nombre del artículo
Ejecutar javascript paso a paso | Run and Debug | Correr JS VSCode ūüöÄ
Descripción
Si estás buscando una forma de ejecutar Javascript paso a paso desde Visual Studio Code este es el post para ti. Cómo hacerlo aquí ✅
Autor
Publisher Name
Eduardo Arias
Publisher Logo
guest

0 Comments
Comentarios en línea
Ver todos los comentarios