Zuvor haben wir uns angesehen, wie Sie mit dem Debuggen eines einfachen Servers beginnen und wie Sie den Code im Debugger verschieben können. Heute werden wir uns zwei weniger herausragende Merkmale ansehen. Die erste ist die Möglichkeit, Variablen zu bearbeiten. Die zweite ist die Fähigkeit, eine Funktion wiederzugeben – um genau zu sein, einen Stapelrahmen neu zu starten – ohne den Debugger oder die Anwendung neu zu starten.

Diese Funktionen sind zwar nicht besonders intuitiv, aber sehr leistungsfähig und können eine Menge Zeit sparen. Sie können eine tief in der Aufrufliste vergrabene Funktion mit unterschiedlichen Eingaben ausprobieren, ohne eine möglicherweise lange und mühsame Reise neu zu beginnen.

Mal sehen, wie wir sie zusammen verwenden können, um verschiedene Szenarien in unserer üblichen kleinen Server-App auszuprobieren.

Einrichtung

Wir spielen mit dem üblichen Code-Snippet herum, kopieren Sie es und fügen Sie es in eine leere Datei ein, wenn es sich noch nicht auf Ihrem Computer befindet:

const http = require('http');
const url = require('url');

const hostname = '127.0.0.1';
const port = 3456;
const serverUrl = `http://${hostname}:${port}`

const getNameFromReq = (req) => {
  const {name} = url.parse(req.url, true).query;

  return name
}

const getGreeting = (name) => {
  const greeting = `Hello, ${name}!`

  return greeting
}

const server = http.createServer((req, res) => {
  const name = getNameFromReq(req)
  const greeting = getGreeting(name)

  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end(`${greeting}\n`);
});

server.listen(port, hostname, () => {
  console.log(`Server running at ${serverUrl}`);
});

Hallo, undefiniert!

Unser Spielzeugserver geht davon aus, dass es immer einen Abfrageparameter namens name gibt in der Anfrage vorhanden. Wenn es fehlt, lautet die Antwort "Hello, undefined!":

> curl http://127.0.0.1:3456
Hello, undefined!

Lassen Sie uns den Debugger verwenden und sehen, wie unser getGreeting Funktion verhält sich mit unterschiedlichem name Parameter. Der Fix ist offensichtlich trivial, aber spielen wir mit, wir sind hier, um zu sehen, was der Debugger tun kann. 🤓

Lassen Sie uns einen Haltepunkt in Zeile 15 setzen und den Server ohne ein Argument für die Namensabfrage erreichen (z. B. curl http://127.0.0.1:3456 ).

Sie sollten sehen, wie der Debugger startet und in Zeile 15 stoppt.

Wenn Sie sich nicht sicher sind, wie das geht, lesen Sie bitte Teil 1, die Grundlagen

Stellen Sie sicher, dass die Abschnitte „Variablen“ und „Aufrufliste“ in der Debug-Seitenleiste geöffnet sind. Wir konzentrieren uns auf die lokale Variable name vorerst undefiniert:

Gehen wir über die nächste Zeile (F10 ) und beobachten Sie den Rückgabewert von getGreeting :

Wenn Sie einen schnellen Überblick über das Übersteigen, Einsteigen und Aussteigen benötigen, lesen Sie Teil 2, Navigieren mit Schritten

Ok, hier gibt es keine Überraschungen:Wenn die name ist undefined , lautet die Begrüßung Hello, undefined! .

Zurückspulen

Lassen Sie uns diese Funktion erneut ausführen, diesmal mit einem anderen name . Wir müssen keine weitere Anfrage abfeuern - wir können den letzten Stack-Frame neu starten:

Und wir sind wieder am Anfang der getGreeting Funktion 👌

Versuchen wir nun, was passieren würde, wenn der Name null wäre ? Wir können die lokale Variable zur Finanzierung bearbeiten:

Wir können versuchen, einen Stringwert zu setzen - achten Sie auf die Anführungszeichen um den Wert:

Sie können alles Lokale oder in der Closure definierte überschreiben, einschließlich Funktionen:

Denken Sie daran:Sobald Sie Funktionen überschreiben, müssen Sie den Prozess neu starten, um zur ursprünglichen Implementierung zurückzukehren.

Und das ist es:Sie können jetzt Funktionen im Debugger neu starten und lokale und Closure-Werte bearbeiten, einschließlich Strings und Funktionen. Warum spielen Sie nicht herum und sehen, was passiert, wenn Sie Funktionen weiter oben im Stack neu starten?

Viel Spaß beim Debuggen! 🥼