AYUDA EN LÍNEA
 WINDEVWEBDEV Y WINDEV MOBILE

¡Nueva funcionalidad de WEBDEV 2024!
Ayuda / Tutorial WEBDEV / Tutorial - Fundamentos de WLanguage
  • Lección 7 - Depurador
  • Presentación
  • Uso del depurador
  • Iniciar el depurador
  • Ejecución paso a paso
  • Ejecutar una serie de líneas
  • Definir la siguiente instrucción a ejecutar
  • Agregar una expresión seguir los cambios en su valor
  • En resumen

Tutorial - Fundamentos de WLanguage

Lección 7 - Depurador
Abordaremos los siguientes temas:
  • Presentación.
  • Uso del depurador.
Durée de la leçon 30 min
Presentación
En esta lección vamos a ver el depurador que viene con WINDEV, WEBDEV y WINDEV Mobile.
¿Qué es un depurador?
Un depurador es una herramienta que permite seguir la ejecución de un código o aplicación paso a paso. Incluye varias funcionalidades:
  • Puntos de interrupción
  • Ejecución de líneas de código paso a paso
  • Visualización de variables
  • Visualización de la jerarquía de procesos
  • Evaluación de expresiones y uso de expresiones de auto-stop
  • Visualización del contenido de los campos de un archivo de datos, etc.
Permite optimizar fácilmente un proceso o una aplicación entera.
En esta lección, utilizaremos el depurador en el código de los procedimientos que creamos en la lección anterior. Esto nos permitirá descubrir las principales funcionalidades del depurador.
Uso del depurador
Utilizaremos el depurador en el proyecto "WLanguage":
  1. Si es necesario, abra el proyecto "WLanguage" que creó en la primera lección de este tutorial (consulte el párrafo Un proyecto para descubrir WLanguage de la lección 1).
  2. Si es necesario, abra los eventos WLanguage del proyecto:
    • Haga clic derecho en la "P" que se encuentra junto a las pestañas de elementos abiertos. El menú contextual se abre.
    • Seleccione "Código del elemento".
    • El editor de código muestra los diferentes eventos asociados al proyecto.

Iniciar el depurador

Para iniciar el depurador, estableceremos un punto de interrupción y ejecutaremos la prueba del proyecto. Los puntos de interrupción establecen la línea de código desde la que comienza el depurador. En el editor de código, los puntos de interrupción aparecen como un punto rojo en el margen izquierdo de la línea de código deseada.
Establezca un punto de interrupción en el código de inicialización del proyecto:
  1. Haga clic a la izquierda de la primera línea de código ("AmountInclTax is currency"), o pulse Ctrl + B.
  2. El punto de interrupción aparece como un punto rojo.
    Depurador

    El depurador se iniciará automáticamente cuando se ejecute la línea en la que se estableció el punto de interrupción.
    Existen varios métodos para iniciar el depurador.
    Para obtener más información, consulte Modos de inicio del depurador.
Ahora ejecutaremos la prueba del proyecto:
  1. Haga clic en "GO" en los íconos de acceso rápido.
  2. El depurador inicia una vez que se ejecuta la línea de código que tiene el punto de interrupción.
  3. El editor de código aparece en modo de "Depuración": una barra naranja aparece en la parte inferior del editor y se selecciona la pestaña "Depurador". La línea de código que se ejecuta está indicada con una flecha (). Un tooltip muestra el contenido de las variables manipuladas en la línea de código.
    Depurador
    El panel "Depurador" aparece en la parte inferior de la pantalla. Este panel muestra dos áreas distintas:
    • la pila de llamadas: Esta área permite conocer la jerarquía de los eventos y procesos que se muestran en el depurador. En nuestro ejemplo, estamos depurando el evento "Inicialización de WLanguage".
    • la lista de expresiones a evaluar. De forma predeterminada, las principales variables utilizadas en el código WLanguage se muestran en esta área. Puede agregar variables para seguir su evolución (esta funcionalidad se presentará más adelante). Por ahora, solo se muestra la variable AmountInclTax.
Vamos a realizar algunas operaciones en el depurador para descubrir sus funcionalidades.

Ejecución paso a paso

En primer lugar, vamos a ejecutar las diferentes instrucciones paso a paso y ver el contenido de las variables:
  1. Pulse F8 (o haga clic en "Paso a paso" en la cinta de opciones). La ejecución pasa a la siguiente línea de código. Los valores de las variables se modifican (si es necesario) en el panel "Depurador" (que se muestra en la parte inferior de la pantalla).
  2. Para ejecutar el procedimiento CalculateInclTax a través del depurador, pulse F7 (o haga clic en "Paso a paso detallado" en la cinta de opciones).
    Diferencia entre las teclas F7 y F8:
    • La tecla F8 ejecuta las líneas de código "paso a paso", pero sin entrar en el código de las funciones o procedimientos.
    • La tecla F7 ejecuta un proceso más detallado paso a paso: este modo permite entrar en el código de los procedimientos o funciones y ejecutar el código correspondiente paso a paso.
  3. Enseguida, se muestra el código del procedimiento CalculateInclTax.
  4. Pulse F8: el procedimiento se ejecuta paso a paso (línea por línea).
  5. Pulse Alt + Fin (opción "Salir" en la cinta de opciones) para salir del procedimiento.
Cierre el depurador: haga clic en la opción "Finalizar prueba" de la cinta del depurador.

Ejecutar una serie de líneas

Para las siguientes acciones en el depurador, utilizaremos una sección de código WLanguage que vimos en la lección anterior.
  1. Si es necesario, elimine el código WLanguage del evento "Inicialización" del proyecto y copie el siguiente código:
    ArrayOfNumbers is array of int

    FOR Index = 1 TO 100

    Trace("Loop | Index value: [%Index%]")

    IF Index = 50 THEN
    Trace("Break condition")
    BREAK
    END

    IF IsOdd(Index) = False THEN
    Trace("The index is even: go to next iteration")
    CONTINUE
    END
    ArrayOfNumbers.Add(Index)
    Trace("[%Index%] was added to the array")
    END

    FOR Index = 1 _TO_ ArrayOfNumbers.Count
    // Display the index and the corresponding value in the array
    Trace("Index: "+ Index + " | Value: " + ArrayOfNumbers[Index])
    END
    Recordatorio: Este código rellena un array mediante un bucle agregando solo números impares entre 1 y 100.
  2. Establezca un punto de interrupción en la primera línea de código e inicie la prueba del proyecto.
  3. El depurador se inicia. Vamos a realizar algunas operaciones para descubrir las funcionalidades del depurador.
En primer lugar, veamos cómo ejecutar directamente un conjunto de líneas de código. En el depurador, no es necesario ejecutar cada línea de código del proceso a depurar.
  1. Mueva el cursor a la siguiente línea de código:
    IF IsOdd(Index) = False THEN
  2. Pulse F6 (o haga clic en "Ejecutar hasta el cursor" en la cinta de opciones). Se ejecutarán todas las líneas de código entre la línea actual y la línea en la que se encuentra el cursor. La ventana de salida aparece con el siguiente contenido:
    Loop | Index value: 1

    Atención: Puede que la ventana de salida se muestre "detrás" del editor.
  3. Pulse F8 (para ejecutar las líneas de código paso a paso). Como la condición es falsa, el código de la instrucción IF no se ejecuta.

Definir la siguiente instrucción a ejecutar

El depurador también permite definir qué instrucción debe ejecutarse a continuación. Así, se puedan "saltar" ciertas líneas de código, por ejemplo: estas líneas de código no se ejecutarán.
  1. Mueva la flecha que marca la línea actual () hasta la línea de código que contiene la función "Trace" en la instrucción IF:
    Trace("The index is even: go to next iteration")
    Esta acción define la siguiente instrucción. En nuestro ejemplo, nos "saltamos" las líneas que agregan elementos al array: no se agregará ningún elemento.
  2. Establezca un punto de interrupción en la siguiente línea:
    ArrayOfNumbers.Add(Index)
    Para ello, simplemente haga clic a la izquierda de la línea de código. Enseguida, aparece un punto rojo.
  3. Pulse F5 para ejecutar el código hasta el punto de interrupción. La ventana de salida ahora muestra:
    Loop | Index value: 1
    The index is even: go to next iteration
    Loop | Index value: 2
    The index is even: go to next iteration
    Loop | Index value: 3
    El tooltip que muestra información sobre las variables del depurador nos indica que estamos en el índice 3.
  4. Elimine el punto de interrupción.

Agregar una expresión seguir los cambios en su valor

Ahora, vamos a agregar una expresión, y seguiremos los cambios en su valor en el panel "Depurador". Esta expresión puede ser de cualquier tipo: variable, función, operación sobre variables, etc. El resultado de la expresión se calcula y muestra. Esta expresión permite realizar una depuración personalizada. Por ejemplo, puede ver el contenido de una variable mientras se utiliza en la aplicación.
  1. Establezca un punto de interrupción en la siguiente línea:
    FOR Index = 1 _TO_ ArrayOfNumbers.Count
    Para ello, simplemente haga clic a la izquierda de la línea de código. Enseguida, aparece un punto rojo.
  2. Pulse F5 para ejecutar el código hasta el nuevo punto de interrupción.
  3. Seleccione "Index" en el editor de código y haga clic con el botón derecho para abrir el menú contextual. Seleccione "Agregar expresión al depurador".
  4. La expresión se agrega automáticamente al panel del depurador en la parte inferior de la pantalla. Por ahora, no se puede evaluar la expresión porque no se ha ejecutado la línea de código.
  5. Pulse F8 para ejecutar el código paso a paso.
  6. El valor de Index cambia a 1.
Vamos a utilizar una expresión "Auto-stop". La expresión "Auto-stop" inicia el modo de depuración cuando una condición se evalúa como verdadera o cuando cambia el valor de una variable. En nuestro ejemplo, iniciaremos el depurador cuando el valor de Index sea 10:
  1. En el panel "Depurador", seleccione la expresión "Index" que agregamos anteriormente.
  2. Haga clic en el punto verde: este se vuelve rojo. Esto significa que la expresión se convierte en "Auto-stop". El depurador se mostrará cuando cambie el valor de la variable.
  3. Continuemos con la prueba de la aplicación: presione F5.
  4. Un mensaje aparece indicando que el valor de la variable "Index" ha cambiado.
  5. Valide.
  6. Ahora, vamos a agregar una condición para que se muestre el depurador: el valor del Índice debe ser 10. En el panel "Depurador", seleccione la expresión "Index". Haga clic de nuevo en la expresión: la columna "Expresión" se vuelve editable. En el área "Expresión", agregue "=10". Obtendrá "Index = 10". Presione la tecla Entrar para validar.
  7. Pulse F5. El programa sigue ejecutándose. El depurador se inicia de nuevo cuando el valor de la variable Index es 10.
Ahora veremos el contenido de la variable Array. Este contenido puede mostrarse en una ventana específica llamada "Ventana de inspección".
  1. En el panel "Depurador", seleccione la expresión "ArrayOfNumbers".
  2. En el menú contextual seleccione "Editar". Una ventana específica muestra el contenido de la variable, es decir, los diferentes valores en el array. Esta ventana puede permanecer abierta mientras se depura la aplicación.
    La ventana de inspección permite ver el contenido de cualquier tipo de variable. La información puede mostrarse en formato de texto o hexadecimal.
Hemos cubierto las principales características del depurador. Para detener la prueba en el depurador, haga clic en "Finalizar prueba" en la cinta de opciones.
En resumen
En esta lección, vimos las principales opciones del depurador:
  • Cómo iniciar el depurador,
  • Cómo ejecutar un proyecto paso a paso,
  • Cómo definir la siguiente instrucción,
  • Cómo crear una expresión auto-stop.
En la próxima lección, veremos cómo utilizar la Programación Orientada a Objetos (POO).
Lección anteriorTabla de contenidoSiguiente lección
Versión mínima requerida
  • Versión 2024
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 17/11/2023

Señalar un error o enviar una sugerencia | Ayuda local