Maison >interface Web >js tutoriel >Pourquoi les journaux de la console affichent-ils des valeurs différentes dans Chrome, Firefox et Safari ?

Pourquoi les journaux de la console affichent-ils des valeurs différentes dans Chrome, Firefox et Safari ?

DDD
DDDoriginal
2024-10-25 14:21:451032parcourir

Why Do Console Logs Show Different Values in Chrome, Firefox, and Safari?

Différences de valeurs d'objet de console dans Chrome, Firefox et Safari

En JavaScript, les objets sont stockés par référence, ce qui signifie que console.log appelle avec les arguments d'objet, enregistrez une référence d'objet. Cela peut conduire à un comportement surprenant lors de l'affichage de l'objet dans la console.

Dans Firebug de Firefox, la journalisation d'un objet affiche systématiquement les valeurs correctes :

Object { bar=1111 }
1111

Object { bar=2222 }
2222

Cependant, dans les consoles Chrome et Safari, un comportement différent est observé :

Object { bar=2222 }                      // Object shows updated value
1111                                      // Attribute value remains unchanged

Object { bar=2222 }                      // Object shows updated value
2222                                      // Attribute value is correct

Cette incohérence provient de la décision de conception dans Chrome (et Safari, car il utilise WebKit) de mettre en cache l'objet après le premier appel console.log. La valeur mise en cache est utilisée pour tous les appels console.log ultérieurs, même si l'objet est mis à jour entre-temps.

Pour éviter cette confusion, il est recommandé d'utiliser des méthodes non-objet pour enregistrer les valeurs des objets, telles que :

console.log(JSON.stringify(foo));      // Serializes the object into a JSON string

Vous pouvez également utiliser les méthodes toJSON et valueOf de Chrome, qui offrent des fonctionnalités similaires :

console.log(foo.toJSON());                // Invokes the object's `toJSON` method (if defined)
console.log(foo.valueOf());               // Invokes the object's `valueOf` method (if defined)

En utilisant ces techniques, vous pouvez vous assurer que les valeurs affichées dans la console sont conforme à l'état réel de l'objet.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn