Warum zeigen Chrome und Safari im Vergleich zu Firefox unterschiedliche Objektwerte in der Konsole an?

Unterschiedliche Objektanzeigewerte in Chrome, Firefox und Safari

Beim Debuggen von JavaScript-Objekten in verschiedenen Browsern können Entwickler auf Diskrepanzen bei den angezeigten Werten in der Konsole stoßen. In diesem Artikel wird dieses Problem untersucht und eine Erklärung für das beobachtete Verhalten bereitgestellt.

Das Problem

Betrachten Sie den folgenden JavaScript-Code:

var foo = {bar: 1111};
console.log(foo);
console.log(foo.bar);

foo.bar = 2222;
console.log(foo);
console.log(foo.bar);

In Firefox ist die erwartete Ausgabe beobachtet:

Object { bar=1111}
1111

Object { bar=2222}
2222

Allerdings unterscheidet sich die Ausgabe in Chrome und Safari:

Object { bar=2222}
1111

Object { bar=2222}
2222

Erklärung

Dieser Unterschied ergibt sich aus einer Designentscheidung in Chrome (und, im weiteren Sinne die Browserkonsole von Safari. Beim Protokollieren eines Objekts erstellt Chrome einen Verweis auf das Objekt selbst. Beim Klicken und Öffnen der Objektregisterkarte in der Konsole bleibt der protokollierte Wert unabhängig von späteren Änderungen am Objekt konstant. Dadurch entsteht eine Diskrepanz zwischen dem angezeigten Wert und dem tatsächlichen Wert des Objekts im Speicher.

Lösung

Um dieses Problem zu beheben und die erwartete Ausgabe in Chrome und Safari zu erhalten, können Entwickler eine beliebige Methode anwenden um das Objekt zu serialisieren, z. B. JSON.stringify():

console.log(JSON.stringify(foo));

Dadurch wird die JSON-Darstellung des Objekts angezeigt, wodurch eine konsistente Ausgabe in allen Browsern sichergestellt wird.

Das obige ist der detaillierte Inhalt vonWarum zeigen Chrome und Safari im Vergleich zu Firefox unterschiedliche Objektwerte in der Konsole an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!