如何以字符串格式显示JavaScript对象的内容,就像我们警告变量时一样?
与显示对象的格式相同。
如何以字符串格式显示JavaScript对象的内容,就像我们警告变量时一样?
与显示对象的格式相同。
当前回答
(这已添加到我的GitHub库中)
在这里重塑车轮!这些解决方案都不适合我的情况。所以,我很快修改了威尔森佩奇的答案。这一个不适用于打印到屏幕(通过控制台、文本字段或其他方式)。在这些情况下,它确实工作得很好,而且正如OP所要求的那样,工作得很正常。这里的许多答案没有解决OP请求的使用警报的问题。无论如何,它是为数据传输而格式化的。此版本似乎返回了与toSource()非常相似的结果。我没有针对JSON.stringify进行过测试,但我认为这也是一回事。这个版本更像是一个poly-fil,因此您可以在任何环境中使用它。此函数的结果是有效的Javascript对象声明。
我不会怀疑这样的事情是否已经在某个地方发生了,但这比花一段时间搜索过去的答案要短得多。因为当我开始搜索这个问题时,这个问题是我在谷歌上的热门话题;我想把它放在这里可能会帮助其他人。
无论如何,该函数的结果将是对象的字符串表示,即使对象具有嵌入的对象和数组,即使这些对象或数组具有更进一步的嵌入对象和数组。(我听说你喜欢喝酒?所以,我用冷却器给你的车拉皮条。然后,我用冰箱给你的冷却器拉皮条,所以,你的冷却器可以在你保持凉爽的同时喝酒。)
数组用[]而不是{}存储,因此没有键/值对,只有值。像常规数组一样。因此,它们的创建方式与数组相同。
此外,所有字符串(包括键名)都被引用,除非这些字符串具有特殊字符(如空格或斜线),否则这是不必要的。但是,我不想检测到这一点,只是为了删除一些引用,否则这些引用仍然可以正常工作。
然后,这个生成的字符串可以与eval一起使用,也可以通过字符串操作将其转储到var中。因此,从文本重新创建对象。
function ObjToSource(o){
if (!o) return 'null';
var k="",na=typeof(o.length)=="undefined"?1:0,str="";
for(var p in o){
if (na) k = "'"+p+ "':";
if (typeof o[p] == "string") str += k + "'" + o[p]+"',";
else if (typeof o[p] == "object") str += k + ObjToSource(o[p])+",";
else str += k + o[p] + ",";
}
if (na) return "{"+str.slice(0,-1)+"}";
else return "["+str.slice(0,-1)+"]";
}
如果我搞砸了,让我知道,在我的测试中效果很好。此外,我能想到的检测类型数组的唯一方法是检查长度的存在。因为Javascript确实将数组存储为对象,所以我实际上无法检查数组类型(没有这样的类型!)。如果其他人知道更好的方法,我很乐意听到。因为,如果您的对象也有一个名为length的属性,那么这个函数将错误地将其视为数组。
EDIT:添加了对空值对象的检查。谢谢布罗克·亚当斯
EDIT:下面是能够打印无限递归对象的固定函数。这与从FF打印toSource不同,因为toSource将打印一次无限递归,其中as,此函数将立即终止它。这个函数的运行速度比上面的慢,所以我在这里添加它,而不是编辑上面的函数,因为只有当你计划在某个地方传递链接到自己的对象时,才需要它。
const ObjToSource=(o)=> {
if (!o) return null;
let str="",na=0,k,p;
if (typeof(o) == "object") {
if (!ObjToSource.check) ObjToSource.check = new Array();
for (k=ObjToSource.check.length;na<k;na++) if (ObjToSource.check[na]==o) return '{}';
ObjToSource.check.push(o);
}
k="",na=typeof(o.length)=="undefined"?1:0;
for(p in o){
if (na) k = "'"+p+"':";
if (typeof o[p] == "string") str += k+"'"+o[p]+"',";
else if (typeof o[p] == "object") str += k+ObjToSource(o[p])+",";
else str += k+o[p]+",";
}
if (typeof(o) == "object") ObjToSource.check.pop();
if (na) return "{"+str.slice(0,-1)+"}";
else return "["+str.slice(0,-1)+"]";
}
测试:
var test1 = new Object();
test1.foo = 1;
test1.bar = 2;
var testobject = new Object();
testobject.run = 1;
testobject.fast = null;
testobject.loop = testobject;
testobject.dup = test1;
console.log(ObjToSource(testobject));
console.log(testobject.toSource());
结果:
{'run':1,'fast':null,'loop':{},'dup':{'foo':1,'bar':2}}
({run:1, fast:null, loop:{run:1, fast:null, loop:{}, dup:{foo:1, bar:2}}, dup:{foo:1, bar:2}})
注意:试图打印document.body是一个可怕的例子。首先,FF在使用toSource时只打印一个空对象字符串。当使用上述函数时,FF在SecurityError上崩溃:操作不安全。。Chrome将在UncaughtRangeError上崩溃:超过了最大调用堆栈大小。显然,document.body并不是要转换为字符串。因为它要么太大,要么违反安全策略访问某些财产。除非,我把这里搞砸了,告诉我!
其他回答
试试这个:
var object = this.window;
console.log(object,'this is window object');
输出:
var list = function(object) {
for(var key in object) {
console.log(key);
}
}
其中object是您的对象
或者您可以在chrome开发工具的“控制台”选项卡中使用此选项:
console.log(对象);
使用本机JSON.stringify方法。适用于嵌套对象,所有主要浏览器都支持此方法。
str = JSON.stringify(obj);
str = JSON.stringify(obj, null, 4); // (Optional) beautiful indented output.
console.log(str); // Logs output to dev tools console.
alert(str); // Displays output using window.alert()
链接到Mozilla API参考和其他示例。
obj = JSON.parse(str); // Reverses above operation (Just in case if needed.)
如果您遇到此Javascript错误
"Uncaught TypeError: Converting circular structure to JSON"
如果要打印对象的全长,可以使用
console.log(require('util').inspect(obj,{showHidden:false,depth:null})
如果要通过将对象转换为字符串来打印该对象,则
console.log(JSON.stringify(obj));
最简单的答案
我很惊讶,这没有一个更简单的答案,只是一群人重复着完全相同的2件事,还有一些人用不可读的代码。。。
干得好。如果您只需要将对象作为字符串(无嵌套级别):
function prettyStringifyObject(obj: Record < any, any > ) {
let result = ''
for (const key in obj) {
result = `${result}${result !== '' ? ', ' : ''}${key}: ${Array.isArray(obj[key]) ? `[${obj[key]}]` : obj[key]}`
}
return `{${result}}`
}
测验
使用测试
const someTestObject = {
data: [1, 2, 3, "4"],
aString: "awdasdyhblhyb",
aBoolean: true,
aNumber: 50,
aNull: null
aNestedObject: {
someOtherData: [],
isNested: true
}
}
console.log(prettyStringifyObject(someTestObject))
结果:
"{data: [1,2,3,4], aString: awdasdyhblhyb, aBoolean: true, aNumber: 50, aNull: null, aNestedObject: [object Object]}"
你可以看看我在这里做的JSFiddle