Übung: Verwenden des integrierten Node.js-Debuggers

Abgeschlossen

Um die eben kennengelernten Debuggenkonzepte in die Praxis umzusetzen, werden Sie eine kurze Node.js-Anwendung erstellen, um die Nte Zahl der Fibonacci-Sequenz zu berechnen.

Die Fibonacci-Folge ist eine Reihe von Zahlen, die mit den Zahlen 0 und 1 beginnt und in der alle anschließenden Zahlen die Summe der beiden vorherigen Zahlen sind. Die Reihe wird wie folgt fortgesetzt:

0, 1, 1, 2, 3, 5, 8, 13, 21...

Lassen Sie uns eine neue Node.js-Anwendung erstellen, um das Konzept zu veranschaulichen.

Öffnen des Projekts im Entwicklungscontainer

Dieses Schulungsmodul bietet einen Entwicklungscontainer, entweder in einem Browser oder für Ihren lokalen Computer. Dieser Container bietet alle erforderlichen Umgebungen, damit Sie dieses Schulungsmodul verwenden können, ohne eine IDE oder Node.js installieren zu müssen. Sie müssen nichts über den Container wissen, um dieses Schulungsmodul abzuschließen.

  1. Starten Sie den Prozess, um einen neuen GitHub Codespace im Branch main des GitHub-Repositorys MicrosoftDocs/node-essentials zu erstellen.

  2. Überprüfen Sie auf der Seite Codespace erstellen die Codespace-Konfigurationseinstellungen und wählen Sie dann Neuen Codespace erstellen aus.

    Screenshot of the confirmation screen before creating a new codespace.

  3. Warten Sie den Start des Codespaces ab. Dieser Startvorgang kann einige Minuten dauern.

  4. Öffnen Sie ein neues Terminal im Codespace.

    Tipp

    Sie können das Hauptmenü verwenden, um zur Menüoption Terminal zu navigieren und dann die Option Neues Terminal auszuwählen.

    Screenshot of the codespaces menu option to open a new terminal.

  5. Überprüfen Sie, dass Node.js in Ihrer Umgebung installiert ist:

    node --version
    

    Der Entwicklungscontainer verwendet eine Node.js LTS-Version. Die genaue Version kann unterschiedlich sein.

  6. Die restlichen Übungen in diesem Projekt finden im Kontext dieses Entwicklungscontainers statt.

Vorbereiten der Umgebung

Bevor Sie mit der eigentlichen Übung beginnen, müssen Sie den Code und die Umgebung vorbereiten.

  1. Öffnen Sie den Unterordner ./nodejs-debug, und erstellen Sie dann eine neue JavaScript-Datei mit dem Namen myfibonacci.js. Die Datei, die bereits im Ordner vorhanden ist, ist eine Lösung für die Übung, wobei der beim Debuggen gefundene Fehler behoben werden muss.

  2. Fügen Sie diesen Code in die Datei ein:

    function fibonacci(n) {
      let n1 = 0;
      let n2 = 1;
      let sum = 0;
    
      for (let i = 2; i < n; i++) {
        sum = n1 + n2;
        n1 = n2;
        n2 = sum;
      }
    
      return n === 0 ? n1 : n2;
    }
    
    const result = fibonacci(5);
    console.log(result);
    
  3. Speichern Sie die Datei, STRG + S.

  4. Klicken Sie mit der rechten Maustaste auf den ./nodejs-debug-Unterordner, wählen Sie Open in integrated terminal aus, und führen Sie das Programm mithilfe des folgenden Befehls aus:

    node fibonacci.js
    

Die Anwendung sollte das Ergebnis 3 (drei) in der Konsole anzeigen. Anscheinend enthält der Code einen Fehler, denn das erwartete Ergebnis war 5 (fünf). Mithilfe des integrierten Node.js-Debuggers werden Sie nun untersuchen, was schiefgelaufen ist.

Spickzettel für Debugger-Befehle

Der integrierte Node.js-Debugger verfügt über eine Reihe von Befehlen, mit denen Sie die Ausführung Ihres Programms steuern können. Hier ist ein kurzer Spickzettel der am häufigsten verwendeten Befehle:

Befehl Beschreibung
c Weiter. Hiermit wird die Ausführung bis zum nächsten Haltepunkt oder dem Ende des Programms ausgeführt.
next Überspringen: Dieser Befehl ähnelt dem step-Befehl, mit dem Unterschied, dass er, wenn die nächste Codezeile ein Funktionsaufruf ist, die Funktion ausführt, ohne sie schrittweise auszuführen.
s Einzelschritt. Dieser Befehl ähnelt dem next-Befehl, mit dem Unterschied, dass er, wenn die nächste Codezeile ein Funktionsaufruf ist, er zur ersten Zeile des Codes dieser Funktion wechselt.
sb() Hiermit fügen Sie in der aktuellen Zeile einen Breakpoint ein.
exec <EXPR> Ein Ausdruck wird innerhalb des aktuellen Ausführungskontexts ausgewertet. Mit diesem Befehl können Sie Informationen zum aktuellen Zustand erhalten. Mithilfe von exec i können Sie beispielsweise den Wert einer Variablen namens i abrufen.
STRG + D Beenden Sie den Debugger.

Starten des integrierten Debuggers

Starten Sie das Programm noch mal, wenn der integrierte Debugger aktiviert ist: Geben Sie den folgenden Befehl in das Terminal ein:

node inspect fibonacci.js

Im Terminal sollte die Debuggereingabeaufforderung angezeigt werden. Führen Sie nun den Code schrittweise aus, indem Sie s + <Enter> ausführen, bis der Ausführungspunkt am Anfang der fibonacci-Funktion gefunden wird, wie folgt:

break in fibonacci.js:2
  1 function fibonacci(n) {
> 2   let n1 = 0;
  3   let n2 = 1;
  4   let sum = 0;
debug>

An dieser Stelle können Sie mithilfe des folgenden Befehls den Wert des Parameters n überprüfen, der an die Funktion übergeben wird:

exec n

In der Konsole sollte 5 (fünf) als Ergebnis angezeigt werden. Führen Sie den s-Befehl weiter aus, bis sich der Ausführungspunkt innerhalb des Anfangspunkts der Schleife befindet. Diesen Punkt erreichen Sie über fünf Schritte mit dem s-Befehl:

break in fibonacci.js:7
  5
  6   for (let i = 2; i < n; i++) {
> 7     sum = n1 + n2;
  8     n1 = n2;
  9     n2 = sum;
debug>

Hinweis

Möglicherweise haben Sie bemerkt, dass für die Navigation in der for(...) {}-Zeile mehrere Debug-Befehle erforderlich sind. Der Grund hierfür ist, dass diese Zeile mehrere Anweisungen enthält. Wenn Sie einen Schritt ausführen, wird mit der nächsten Anweisung im Code fortgefahren. Üblicherweise gibt es eine Anweisung pro Zeile. Sollte dies nicht der Fall sein, müssen Sie mehrere Schritte ausführen, um zur nächsten Zeile zu wechseln.

Suchen des Fehlers mithilfe von Haltepunkten

Nun fügen wir in dieser Zeile einen Breakpoint hinzu, um schnell durch die Schleifeniterationen navigieren zu können: Geben Sie den folgenden Befehl in das Terminal ein:

sb()

In der Konsole sollten die gleichen Zeilen noch einmal angezeigt werden. Dies deutet darauf hin, dass in dieser Zeile ein Haltepunkt gesetzt wurde. Wenn der aktuelle Ausführungspunkt verschoben wird, wird ein Sternchen * in der Zeile angezeigt, in der Sie den Breakpoint festgelegt haben.

Fahren Sie mithilfe des c-Befehls mit der nächsten Schleifeniteration im Terminal fort.

c

Wir können den aktuellen Iterationsstatus mit dem exec-Befehl überprüfen und den Wert mehrerer Variablen mithilfe eines Arrays als Befehlsparameter anzeigen. Um die Werte des Iterators i und der Summe sum anzuzeigen, verwenden wir die Syntax [i, sum]. Geben Sie den folgenden Befehl in das Terminal ein:

exec [i, sum]

In der Konsole sollte das Ergebnis [ 3, 1 ] angezeigt werden.

Der Code hat den Wert der sum-Variablen für die aktuelle Iteration noch nicht aktualisiert, der 3 (drei) beträgt. Der Wert der sum-Variablen zeigt weiterhin die Fibonacci-Zahl für die vorherige Iteration an. Hier sehen Sie die Berechnung, die wir im Code verwenden, um den aktuellen sum-Wert abzurufen:

fibonacci(2) = fibonacci(0) + fibonacci(1)
             = 0 + 1
             = 1

Basierend auf unserer Berechnung scheint es, dass unser Programm bis zu diesem Punkt richtig ausgeführt wird.

Fahren Sie mit der nächsten Schleifeniteration fort, indem Sie den c-Befehl im Terminal ausführen, und überprüfen Sie dann den Zustand erneut:

c
exec [i, sum]

In der Konsole sollte das Ergebnis [ 4, 2 ] angezeigt werden.

Nun folgt die Codestelle, in der die Nummer der Iteration berechnet wird, die Sie interessiert: 5 (fünf). Führen Sie die Iteration mithilfe des Befehls s aus Gründen der Sorgfältigkeit in Einzelschritten aus. Versuchen Sie, den vorherigen Haltepunkt zu erreichen, verfahren Sie dabei jedoch Schritt für Schritt. Überschreiten Sie den Haltepunkt nicht!

Was ist passiert?

Beheben des Fehlers

Nachdem Sie die Schleifenbedingung i < n überprüft haben, ist die Ausführung plötzlich zur Zeile mit dem Befehl return gesprungen. Hier erfahren Sie, was Sie im Terminal sehen sollten:

break in fibonacci.js:12
 10   }
 11
>12   return n === 0 ? n1 : n2;
 13 }
 14

Das ist alles, wir haben den Fehler gefunden! Anstatt die Summe der Iteration auf 5 (fünf) zu aktualisieren, ist der Code aus der Schleife gesprungen. Aus diesem Grund wurde bei der ursprünglichen Ausführung das Ergebnis der vorherigen Iteration 3 (drei) ausgegeben.

Wir müssen die Schleifenbedingung im fibonacci.js-Code beheben. Ändern Sie im Code-Editor den Wert der Testanweisung von kleiner als < in kleiner oder gleich <=:

for (let i = 2; i <= n; i++) {
  sum = n1 + n2;
  n1 = n2;
  n2 = sum;
}

Speichern Sie Ihre Änderungen im Code-Editor, und beenden Sie den Debugger, indem Sie STRG+D auswählen.

Führen Sie nun Ihr Programm erneut im Terminal aus:

node fibonacci.js

Nun sollte das erwartete Ergebnis in der Konsole angezeigt werden: 5 (fünf).

Mithilfe des integrierten Node.js-Debuggers können Sie sich die grundlegenden Debuggingkonzepte aneignen und üben, schnelle Debugsitzungen durchzuführen. Das Eingeben von Befehlen kann jedoch sehr zeitaufwendig sein. Zudem ist das Vorgehen in komplexeren Programmen möglicherweise zu eingeschränkt und zu kompliziert.

In den nächsten Abschnitten erfahren Sie, wie Sie stattdessen den Visual Studio Code-Debugger verwenden.