Start · Sprachen · JavaScript · Referenz · console.trace()

console.trace()

Methode

Gibt die übergebenen Werte zusammen mit dem aktuellen Stack-Trace (Aufrufkette bis zur Aufrufstelle) in der Konsole aus.

seit JavaScript Baseline: alle Browser; Node.js 0.1+ Kategorie: webapi

Signatur

console.trace(...data)

Beschreibung

console.trace() schreibt eine Meldung in die Konsole und hängt den aktuellen Aufrufstapel an, also die Kette der Funktionen, über die das Programm an diese Stelle gelangt ist. So lässt sich schnell klären, wer eine Funktion aufgerufen hat, ohne einen Haltepunkt setzen zu müssen.

Die Methode nimmt beliebig viele Argumente entgegen, genau wie console.log(). Diese werden als Beschriftung vor dem Trace ausgegeben. Formatangaben wie %s, %d oder %o im ersten Argument werden unterstützt. In Node.js läuft die Ausgabe über stderr und beginnt mit Trace:. Im Browser erscheint ein aufklappbarer Eintrag mit Links zu den Quelltextzeilen.

Gut geeignet ist die Methode, um unerwartete Mehrfachaufrufe aufzuspüren (z. B. bei Event-Handlern, Rendering oder Setter-Aufrufen), um asynchrone Abläufe nachzuvollziehen oder um herauszufinden, welches Modul eine gemeinsam genutzte Hilfsfunktion aufruft. Anders als new Error().stack liefert console.trace() keinen Wert zurück, den man weiterverarbeiten könnte. Sie ist nur für die Ausgabe gedacht.

Parameter

Name Typ Default Beschreibung
$...data any[] Beliebige Werte, die wie bei console.log() vor dem Stack-Trace ausgegeben werden. Ist das erste Argument ein String, dürfen darin Formatangaben (%s, %i, %o, %c …) stehen.

Beispiele

Aufrufkette einer Funktion sichtbar machen

const speichern = (daten) => {
  console.trace('speichern() aufgerufen mit', daten);
};

const formularAbsenden = () => speichern({ id: 42 });
const beiKlick = () => formularAbsenden();

beiKlick();
Trace: speichern() aufgerufen mit { id: 42 } at speichern (app.js:2:11) at formularAbsenden (app.js:5:32) at beiKlick (app.js:6:24) at app.js:8:1

Unerwartete Mehrfachaufrufe eines Setters aufspüren

class Warenkorb {
  #anzahl = 0;

  set anzahl(wert) {
    if (wert === this.#anzahl) {
      // Überflüssiger Aufruf: Woher kommt er?
      console.trace('Anzahl unverändert gesetzt: %d', wert);
    }
    this.#anzahl = wert;
  }
}

const korb = new Warenkorb();
korb.anzahl = 3;
korb.anzahl = 3; // löst den Trace aus
Trace: Anzahl unverändert gesetzt: 3 at set anzahl (warenkorb.js:7:15) at warenkorb.js:15:13

Nur im Entwicklungsmodus tracen

const DEBUG = process.env.NODE_ENV !== 'production';

const debugTrace = (...args) => {
  if (DEBUG) console.trace(...args);
};

const ladeBenutzer = async (id) => {
  debugTrace('ladeBenutzer', id);
  return { id, name: 'Anna' };
};

await ladeBenutzer(7);
Trace: ladeBenutzer 7 at debugTrace (debug.mjs:4:22) at ladeBenutzer (debug.mjs:8:3) at debug.mjs:12:7

// Wichtig · Fallstricke

  • Uneinheitliches Format: Wie der Trace aussieht (Einrückung, Dateipfade, Zeilen- und Spaltennummern) hängt von der Laufzeitumgebung ab. Die Ausgabe sollte man nicht maschinell auswerten. Dafür eignet sich eher new Error().stack, wobei auch dessen Format nicht standardisiert ist.
  • Node.js: Die Ausgabe geht an stderr, nicht an stdout. Das ist bei Umleitungen wie node app.js > log.txt wichtig. Die Tiefe des Stapels begrenzt Error.stackTraceLimit (Standard: 10 Einträge).
  • Asynchroner Code: Nach einem await oder in Callbacks von setTimeout fehlt im Stapel oft der ursprüngliche Aufrufer. Chromium-DevTools und Node.js zeigen asynchrone Stack-Traces nur teilweise an.
  • Minifizierter Code: In Produktions-Builds sind Funktionsnamen und Zeilen ohne Source-Maps kaum lesbar.
  • Performance und Datenschutz: Das Erfassen eines Stapels ist deutlich teurer als console.log(). Traces in heißen Schleifen und im Produktionscode vermeiden, denn sie können auch interne Pfade und Strukturen offenlegen.
  • Die Methode wird von allen modernen Browsern und von Node.js unterstützt. In Web Workern erscheint die Ausgabe in der Konsole des Workers.