DevPad: krokování programů v prohlížeči

Krokování: program pod lupou

Tlačítkem Krok (F10) se program vykoná o jeden příkaz a zastaví se. V editoru je zvýrazněný řádek, který přijde na řadu, a panely vpravo ukazují aktuální stav. Stop-značka (F9 nebo klik vedle čísla řádku) zastaví běh na zvoleném místě, Spustit (F5) pustí program naplno až k další značce.

Pro výklad u projektoru se hodí zpomalený běh (Alt+F5): program běží sám, ale tak pomalu, že je vidět každý krok. Rychlost jde nastavit od čtyř sekund po desetinu sekundy na krok a z běhu jde kdykoli přejít do krokování a zase zpátky.

Proměnné a zásobník volání

Panel Proměnné ukazuje název, hodnotu a typ každé proměnné. Proměnná, která už skončila platnost (třeba řídicí proměnná cyklu po jeho konci), zůstane v panelu šedě s poslední hodnotou, takže žák vidí, s čím cyklus skončil.

U funkcí a rekurze ukazuje panel celý zásobník volání: každé rozběhnuté volání má vlastní skupinu s hodnotami argumentů v záhlaví, hlavní program je nahoře, a právě prováděné volání dole. Na rekurzivním quicksortu je tak vidět, že každé volání má své vlastní zacatek, konec a pivot, a pole přitom zůstává jedno a to samé.

Pole, kolekce a objekty

Panel Pole kreslí pole jako tabulku s indexy: jednorozměrné vodorovně nebo svisle, dvourozměrné jako mřížku, u trojrozměrných se vybírá „patro“. Stejně se zobrazí i seznamy (List<T>, list), slovníky jako tabulka klíč–hodnota, množiny, fronty a zásobníky. Seznam objektů se ukáže jako tabulka záznamů: řádek je objekt, sloupce jsou jeho vlastnosti.

Objekty v panelu Proměnné jsou rozbalovací strom, zanořený do libovolné hloubky. Jde ho zkopírovat jako JSON a obsah panelů jako tabulku do Excelu.

Barvy buněk na příkaz programu

Program si může buňky pole sám obarvit: jednu buňku, obdélníkovou oblast, celé pole nebo všechny buňky s danou hodnotou. U řazení je tak hned vidět seřazená část, porovnávaný prvek a dosavadní minimum, u Hry života živé buňky. Příkazy jsou ve všech jazycích stejné, mimo DevPad je program nepotřebuje (v C# je stačí obalit #if DEVPAD).