JavaScript Academy · Lektion

Code schrittweise ausführen

Führen Sie Funktionen schrittweise darüber, hinein und hinaus aus.

Code schrittweise ausführen ist eine kostenlose JavaScript Academy-Lektion auf CoddyKit. Dies ist Lektion 3 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des JavaScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der JavaScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Schrittweise durch den Code gehen

Sobald die Ausführung an einem Breakpoint angehalten ist, gehen Sie den Code schrittweise durch, um zu beobachten, wie sich der Zustand Zeile für Zeile ändert.

Fortsetzen

Die Schaltfläche zum Fortsetzen führt die normale Ausführung bis zum nächsten Breakpoint oder bis zum Ende des Programms weiter. Verwenden Sie sie, wenn Sie beim aktuellen Halt alles Nötige gesehen haben.

Step Over

Step Over führt die aktuelle Zeile vollständig aus, einschließlich aller von ihr aufgerufenen Funktionen, und hält dann an der nächsten Zeile in derselben Funktion an. Die aufgerufene Funktion wird nicht betreten.

function helper() {
  return 5
}
function main() {
  const a = helper()
  const b = a + 1
  return b
}

Step Into

Step Into betritt einen Funktionsaufruf in der aktuellen Zeile und hält bei dessen erster Anweisung an, damit Sie die Funktion darin debuggen können.

function helper() {
  const x = 10
  return x
}
function main() {
  return helper()
}

Step Out

Step Out führt die aktuelle Funktion zu Ende und hält an der Zeile direkt nach dem Aufruf an, der Sie in die Funktion geführt hat. Verwenden Sie diese Option, wenn Sie eine Funktion verlassen möchten, die Sie nicht weiter untersuchen müssen.

Den passenden Schritt-Befehl auswählen

Verwenden Sie Step Over, wenn Sie einer Funktion vertrauen, Step Into, um sie zu untersuchen, und Step Out, sobald Sie bestätigt haben, dass die innere Logik korrekt ist.

Der Call-Stack-Bereich

Während Sie schrittweise vorgehen, zeigt der Call-Stack-Bereich die Kette der Funktionsaufrufe, die zur aktuellen Zeile geführt hat. Wenn Sie auf einen Stack Frame klicken, wechseln Sie zu dessen Kontext.

Zustandsänderungen beobachten

Während Sie schrittweise vorgehen, werden die Bereiche Scope und Watch aktualisiert. So sehen Sie genau, welche Zeile eine Variable unerwartet verändert.

Schrittweise durch Schleifen gehen

Innerhalb einer Schleife wird der Schleifenrumpf bei jedem Schritt erneut für die jeweilige Iteration ausgeführt. Ein bedingter Breakpoint ist oft schneller, als viele Iterationen manuell zu durchlaufen.

function sumTo(n) {
  let total = 0
  for (let i = 1; i <= n; i++) {
    total += i
  }
  return total
}

In Bibliothekscode hineinsteppen

Step Into kann Sie in die Interna einer Bibliothek führen. Die DevTools bieten eine Funktion, mit der Sie aufgelistete Skripte ignorieren können, sodass Sie in Ihrem eigenen Code bleiben.

Ein typischer Ablauf

Setzen Sie einen Breakpoint in der Nähe eines vermuteten Fehlers. Gehen Sie dann Zeile für Zeile vor und beobachten Sie die Variablen, bis Sie feststellen, an welcher Stelle die tatsächlichen Werte von Ihrer Erwartung abweichen.

Kurztest

Testen Sie Ihr Wissen über das schrittweise Vorgehen.

Zusammenfassung

Zusammenfassung: Beim schrittweisen Vorgehen durchlaufen Sie den Code kontrolliert.

Step Over führt eine Zeile aus, ohne aufgerufene Funktionen zu betreten
Step Into betritt eine aufgerufene Funktion
Step Out führt die aktuelle Funktion zu Ende
Der Call Stack zeigt, wie Sie an die aktuelle Stelle gelangt sind

Häufig gestellte Fragen

Ist die Lektion „Code schrittweise ausführen“ kostenlos?

Ja — der vollständige Text von „Code schrittweise ausführen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des JavaScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der JavaScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „Code schrittweise ausführen“?

Führen Sie Funktionen schrittweise darüber, hinein und hinaus aus. Du übst JavaScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um JavaScript Academy zu starten?

Keine Vorkenntnisse erforderlich. JavaScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 3 von 4.

Wie lange dauert die Lektion „Code schrittweise ausführen“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser JavaScript Academy-Lektion Code schreiben und ausführen?

Ja. Jede JavaScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

← Zurück zu JavaScript Academy