Javascript console.log 与 JSON.stringify 不一致

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8733802/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 07:15:27  来源:igfitidea点击:

console.log inconsistent with JSON.stringify

javascriptfirebuggoogle-chrome-devtools

提问by Peteris

I have reason to believe console.logand JSON.stringifycan produce inconsistent views of the same object even if it was created in a straightforward manner (see notes).

我有理由相信console.logJSON.stringify即使它是以简单的方式创建的,也可以产生同一对象的不一致视图(请参阅注释)。

Situation

情况

In both Google Chrome developer tools and Firebug, I had an object objwhich console.logprinted out as { players: {0: ...}, ...}, while JSON.stringifyreported { players: {}, ...}. obj.playerswas {}under both functions, so it seems that console.logis the culprit. Could it be asynchronous/non-deterministic in some way?

在 Google Chrome 开发人员工具和 Firebug 中,我都有一个对象obj,它console.log打印为{ players: {0: ...}, ...},而JSON.stringify报告为{ players: {}, ...}obj.players{}在这两种功能,所以它似乎console.log是罪魁祸首。它可能以某种方式是异步/非确定性的吗?

Additional notes

补充说明

I'm afraid I won't be able to provide much more context, since the code is lengthy and for a client, but I can try if there is something that could help get to the bottom this. For the moment, I am forced to stay away from console.logfor inspection.

恐怕我将无法提供更多的上下文,因为代码很长而且对于客户来说,但我可以尝试是否有什么可以帮助深入了解这一点。目前,我被迫远离console.log检查。

It might be useful to know that the object is formed merely from an object literal by setting properties by hand, e.g., obj.players = {}; obj.players[0] = ....

通过手动设置属性,例如obj.players = {}; obj.players[0] = ....

Code

代码

A sample of what I mean can be observed at http://jsfiddle.net/9dcJP/.

我的意思的示例可以在http://jsfiddle.net/9dcJP/上观察到。

回答by Sebastian Zartner

Why don't you just use console.dir(obj)instead? Or use console.log(obj)and then click on the output / expand it?

你为什么不直接用console.dir(obj)?还是使用console.log(obj)然后点击输出/展开呢?

Also when I try the following code:

此外,当我尝试以下代码时:

var obj = {};
obj.players = {};
obj.players[0] = {color: "green"};
obj.players[1] = {color: "blue"};
obj.world = "xyz";
console.log(JSON.stringify(obj));

I always (Firefox, Chrome, Opera) get this as output:

我总是(Firefox,Chrome,Opera)将其作为输出:

{"players":{"0":{"color":"green"},"1":{"color":"blue"}},"world":"xyz"}

Furthermore it looks like your playersobject is actually an array. So you should better create it as such.

此外,看起来您的players对象实际上是一个数组。所以你应该更好地创建它。

Update:I just saw that you added a link to a JSFIDDLE demo, which empties the playersobject right after logging it. To my knowledge all web dev tools use some kind of asynchronous display, which results in an empty playersobject when using console.log(obj)or console.dir(obj). Firebug thereby offers the best results by displaying the object correctly using console.dir(obj).

更新:我刚刚看到您添加了一个指向 JSFIDDLE 演示的链接,该演示players在记录对象后立即清空该对象。据我所知,所有 Web 开发工具都使用某种异步显示,这会在players使用console.log(obj)或时导致空对象console.dir(obj)。因此,Firebug 通过使用 正确显示对象来提供最佳结果console.dir(obj)

回答by jsdeveloper

To answer the question - yes, console.log operations are asynchronousso can't be relied upon to print accurate values in the console - especially if you modify the printed object straight after the console.log call (like you are doing).

回答这个问题 - 是的,console.log 操作是异步的,所以不能依赖于在控制台中打印准确的值 - 特别是如果你在 console.log 调用之后直接修改打印的对象(就像你正在做的那样)。

If you take away the line:

如果你拿走这条线:

obj.players = {};

then both the differences between the plain console.log and the JSON.stringify dissappear.

那么普通的 console.log 和 JSON.stringify 之间的差异就消失了。

Bearing in mind that there is a difference between logging a real object in a developer tools console (console.log(obj) and printing the stringified version of the object (console.log(JSON.stringify(obj))). So the representation of the object will still be different.

请记住,在开发人员工具控制台中记录真实对象(console.log(obj) 和打印对象的字符串化版本(console.log(JSON.stringify(obj)))之间存在差异。所以表示的对象仍然会有所不同。