如何以字符串格式显示JavaScript对象的内容,就像我们警告变量时一样?

与显示对象的格式相同。


当前回答

它在浏览器中不起作用,您可能只需要在您希望获得对象的有效JS表示而不是JSON的情况下使用它。它只运行节点内联求值

var execSync = require('child_process').execSync

const objectToSource = (obj) =>
  execSync('node -e \'console.log(JSON.parse(`' + JSON.stringify(obj) + '`))\'', { encoding: 'utf8' })

console.log(objectToSource({ a: 1 }))

其他回答

编号:在这些示例中,yourObj定义了要检查的对象。

首先,我最不喜欢但最常用的显示对象的方式:

这是显示对象内容的实际方式

console.log(yourObj)

将产生如下结果:

我认为最好的解决方案是查看对象关键点,然后查看对象值,如果您真的想查看对象的内容。。。

console.log(Object.keys(yourObj));
console.log(Object.values(yourObj));

它将输出如下内容:(上图:存储在对象中的键/值)

如果您使用的是ECMAScript 2016或更高版本,还有一个新选项:

Object.keys(yourObj).forEach(e => console.log(`key=${e}  value=${yourObj[e]}`));

这将产生整洁的输出:前面的回答中提到的解决方案:console.log(yourObj)显示了太多的参数,并且不是显示所需数据的最方便用户的方式。这就是为什么我建议分别记录键和值。

下一步:

console.table(yourObj)

有人在之前的评论中建议过这个,但它从来没有对我起过作用。如果它对其他人在不同的浏览器或其他东西上起作用,那就太好了!我仍将代码放在此处以供参考!将向控制台输出如下内容:

循环引用解决方案

要从包含重复引用(在许多地方对同一对象的引用)(包括循环引用)的对象中生成不包含冗余信息的字符串,请使用JSON.stringify和replacer(在代码段中显示),如下所示

let s = JSON.stringify(obj, refReplacer(), 4);

函数refReplacer(){设m=new Map(),v=new Map),init=null;返回函数(字段,值){让p=m.get(this)+(Array.isArray(this)`[${field}]“:”.“+字段);让isComplex=value==对象(值)如果(isComplex)m.set(值,p);让pp=v.get(value)||'';let path=p.replace(/未定义\.\?/,“”);让val=pp`#REF:${pp[0]==“[”?“$”:“$.”}${pp}“:value;!初始化?(init=value):(val===init?val=“#REF:$”:0);if(!pp&&isComplex)v.set(value,path);返回值;}}// ---------------//测试// ---------------//具有重复引用的gen obj设a={a1:1,a2:2};设b={b1:3,b2:“4”};让obj={o1:{o2:a},b,a};//重复引用a.a3=[1,2,b];//循环引用b.b3=a;//循环引用让s=JSON.stringify(obj,refReplacer(),4);console.log;警报;

基于此(更多信息)的此解决方案为每个对象值创建类似JSONPath的路径,如果同一对象出现两次(或更多),则使用此路径的引用来引用该对象,例如#REF:$.bar.arr[3].foo(其中$表示主对象),而不是“渲染”整个对象(冗余度较低)

奖金:倒置

函数parseRefJSON(json){let objToPath=新映射();let pathToObj=新映射();let o=JSON.parse(JSON);让遍历=(父级,字段)=>{让obj=父级;let path=“#REF:$”;if(字段!==未定义){obj=父[字段];path=objToPath.get(父)+(Array.isArray(父)`[${field}]`:`${field?'。'+字段:''}`);}objToPath.set(obj,路径);pathToObj.set(路径,对象);let ref=路径目标获取(obj);如果(ref)父[字段]=ref;for(让f在obj中)if(obj==对象(obj))遍历(obj,f);}横向(o);返回o;}// ------------//测试// ------------设s=`{“o1”:{“o2”:{“a1”:1,“a2”:2,“a3”:[1.2.{“b1”:3,“b2”:“4”,“b3”:“#REF:$.o1.o2”}]}},“b”:“#REF:$.o1.o2.a3[2]”,“a”:“#REF:$.o1.o2”}`;console.log('打开Chrome控制台查看嵌套字段');let obj=parseRefJSON;console.log(obj);

如果希望以表格格式查看数据,可以使用:

console.table(obj);

如果单击表列,可以对表进行排序。

您还可以选择要显示的列:

console.table(obj, ['firstName', 'lastName']);

您可以在此处找到有关console.table的更多信息

好吧,Firefox(感谢@Bojangles提供详细信息)有Object.toSource()方法,它将对象打印为JSON和function(){}。

我想,对于大多数调试目的来说,这已经足够了。

如果要打印用于调试的对象,请使用以下代码:

var obj = {
  prop1: 'prop1Value',
  prop2: 'prop2Value',
  child: {
    childProp1: 'childProp1Value',
  },
}
console.log(obj)

将显示:

注意:您只能记录对象。例如,这不起作用:

console.log('My object : ' + obj)

注意:您也可以在log方法中使用逗号,然后输出的第一行将是字符串,之后将呈现对象:

console.log('My object: ', obj);