如何以类似 JSON 的格式打印圆形结构？
Posted
技术标签:
【中文标题】如何以类似 JSON 的格式打印圆形结构？【英文标题】：How can I print a circular structure in a JSON-like format? 【发布时间】：2012-07-21 22:20:21 【问题描述】：我有一个大对象要转换为 JSON 并发送。但是它具有圆形结构。我想扔掉任何存在的循环引用并发送任何可以字符串化的东西。我该怎么做？
谢谢。
var obj =
a: "foo",
b: obj
我想将 obj 字符串化为：
"a":"foo"
【问题讨论】：
能否请您发布一个带有您想要解析的循环引用的示例对象？ 类似this? serializing object that contains cyclic object value的可能重复 聚会迟到了，但有一个github 项目来处理这个问题。 密切相关的问题：***.com/questions/23117470/… 【参考方案1】：将JSON.stringify 与自定义替换器一起使用。例如：
// Demo: Circular reference
var circ = ;
circ.circ = circ;
// Note: cache should not be re-used by repeated calls to JSON.stringify.
var cache = [];
JSON.stringify(circ, (key, value) =>
if (typeof value === 'object' && value !== null)
// Duplicate reference found, discard key
if (cache.includes(value)) return;
// Store value in our collection
cache.push(value);
return value;
);
cache = null; // Enable garbage collection
此示例中的替换器并非 100% 正确（取决于您对“重复”的定义）。在以下情况下，会丢弃一个值：
var a = b:1
var o = ;
o.one = a;
o.two = a;
// one and two point to the same object, but two is discarded:
JSON.stringify(o, ...);
但概念是：使用自定义替换器，并跟踪解析的对象值。
作为一个用 es6 编写的实用函数：
// safely handles circular references
JSON.safeStringify = (obj, indent = 2) =>
let cache = [];
const retVal = JSON.stringify(
obj,
(key, value) =>
typeof value === "object" && value !== null
? cache.includes(value)
? undefined // Duplicate reference found, discard key
: cache.push(value) && value // Store value in our collection
: value,
indent
);
cache = null;
return retVal;
;
// Example:
console.log('options', JSON.safeStringify(options))
【讨论】：
@CruzDiablo 序列化 DOM 通常是没有意义的。但是，如果您可以为您的目的想到一个有意义的序列化方法，那么您可以尝试向 DOM 对象添加自定义序列化：Node.prototype.toJSON = function() return 'whatever you think that is right'; ;（如果您想要更通用/特定的东西，只需尝试原型树中的任何东西：htmlDivElement实现 HTMLElement 实现 Element 实现 Node 实现 EventTarget；注意：这可能是依赖于浏览器的，前面的树对于 Chrome 是正确的）
这是错误的，因为它会跳过包含两次的对象的第二次出现，即使不是真正的循环结构。 var a=id:1; JSON.stringify([a,a]);
@user2451227 "此示例中的替换器不是 100% 正确（取决于您对“重复”的定义）。但概念是：使用自定义替换器，并跟踪解析的对象值。”
这里的 GC 问题可以说是多余的。如果这是作为单个脚本运行的，那么脚本会立即终止。如果这被封装在一个函数中以实现，那么cache 将无法访问developer.mozilla.org/en-US/docs/Web/javascript/…
@AndriMöll 很确定 Rob 只是简明地展示了自定义替换器，他做得很好。 Preston's comment 指向一些 Crockfordian code，如果这就是你所追求的，那它是实弹强大的。但概念是一样的。【参考方案2】：
使用带有替换器的 JSON.stringify 方法。阅读本文档以获取更多信息。 http://msdn.microsoft.com/en-us/library/cc836459%28v=vs.94%29.aspx
var obj =
a: "foo",
b: obj
var replacement = "b":undefined;
alert(JSON.stringify(obj,replacement));
找出一种用循环引用填充替换数组的方法。您可以使用 typeof 方法来查找属性是否属于“对象”类型 (reference)，并使用精确相等检查 (===) 来验证循环引用。
【讨论】：
这可能仅适用于 IE（考虑到 MSDN 是来自 Microsoft 的文档，而 Microsoft 创建 IE）。在 Firefox/Chrome 中，jsfiddle.net/ppmaW 会生成循环引用错误。仅供参考：var obj = foo:obj 确实 不 创建循环引用。相反，它会创建一个对象，其foo 属性引用obj 的先前值（undefined 如果先前未定义，则因var obj 而声明）。
是的，这在 Chrome 中不起作用。它只是输出“b”，而不是“obj”中的任何其他值。【参考方案3】：
当您不知道所有循环引用的键时，对于未来寻找此问题解决方案的谷歌用户，您可以使用 JSON.stringify 函数的包装器来排除循环引用。请参阅https://gist.github.com/4653128 的示例脚本。
解决方案本质上归结为在数组中保留对先前打印对象的引用，并在返回值之前在替换函数中检查它。它比仅排除循环引用更具限制性，因为它还排除了两次打印对象的可能性，其中一个副作用是避免循环引用。
示例包装器：
function stringifyOnce(obj, replacer, indent)
var printedObjects = [];
var printedObjectKeys = [];
function printOnceReplacer(key, value)
var printedObjIndex = false;
printedObjects.forEach(function(obj, index)
if(obj===value)
printedObjIndex = index;
);
if(printedObjIndex && typeof(value)=="object")
return "(see " + value.constructor.name.toLowerCase() + " with key " + printedObjectKeys[printedObjIndex] + ")";
else
var qualifiedKey = key || "(empty key)";
printedObjects.push(value);
printedObjectKeys.push(qualifiedKey);
if(replacer)
return replacer(key, value);
else
return value;
return JSON.stringify(obj, printOnceReplacer, indent);
【讨论】：
不错的代码。你有一个愚蠢的错误，你写if(printedObjIndex)，而你应该写if(printedObjIndex==false)，因为index也可以是0，除非你明确说明，否则它会被翻译成false。
@guymograbi 你不是说===吗？ 0 == false 是 true，0 === false 是 false。 ;^) 但我宁愿不将 printedObjIndex 初始化为 false，因为那样你可以检查 undefined，这样你（好吧，特林达兹的）就不会奇怪地混合隐喻了。
@ruffin 不错。是的，显然，总是使用硬相等和 jshint 来捕捉这些愚蠢的错误。【参考方案4】：
我真的很喜欢 Trindaz 的解决方案 - 更详细，但是它有一些错误。我也为喜欢它的人修好了它们。
另外，我对缓存对象添加了长度限制。
如果我要打印的对象真的很大——我的意思是无限大——我想限制我的算法。
JSON.stringifyOnce = function(obj, replacer, indent)
var printedObjects = [];
var printedObjectKeys = [];
function printOnceReplacer(key, value)
if ( printedObjects.length > 2000) // browsers will not print more than 20K, I don't see the point to allow 2K.. algorithm will not be fast anyway if we have too many objects
return 'object too long';
var printedObjIndex = false;
printedObjects.forEach(function(obj, index)
if(obj===value)
printedObjIndex = index;
);
if ( key == '') //root element
printedObjects.push(obj);
printedObjectKeys.push("root");
return value;
else if(printedObjIndex+"" != "false" && typeof(value)=="object")
if ( printedObjectKeys[printedObjIndex] == "root")
return "(pointer to root)";
else
return "(see " + ((!!value && !!value.constructor) ? value.constructor.name.toLowerCase() : typeof(value)) + " with key " + printedObjectKeys[printedObjIndex] + ")";
else
var qualifiedKey = key || "(empty key)";
printedObjects.push(value);
printedObjectKeys.push(qualifiedKey);
if(replacer)
return replacer(key, value);
else
return value;
return JSON.stringify(obj, printOnceReplacer, indent);
;
【讨论】：
你在这一行缺少一个空检查：返回“（参见“+（!!value.constructor？value.constructor.name.toLowerCase（）：typeof（value））+”键 " + printedObjectKeys[printedObjIndex] + ")"; 我很乐意添加它。让我知道什么是可以为空的，因为到目前为止我确实遇到了任何问题。 // 浏览器不会打印超过 20K - 但是您将限制设置为 2k。也许为未来改变？【参考方案5】：在 Node.js 中，您可以使用 util.inspect(object)。它会自动将循环链接替换为“[Circular]”。
虽然是内置的（不需要安装），你必须导入它
import * as util from 'util' // has no default export
import inspect from 'util' // or directly
// or
var util = require('util')
console.log(util.inspect(myObject))
另外请注意，您可以传递选项对象来检查 （参见上面的链接）
inspect(myObject[, options: showHidden, depth, colors, showProxy, ...moreOptions])
请阅读下面的评论者并向他们致敬...
【讨论】：
util 是一个内置模块，你不必安装它。 console.log(util.inspect(obj)) @Mitar 它是内置的，但你仍然需要加载模块var util = require('util');
别像我一样傻，它只是 obj_str = util.inspect(thing)，而不是garbage_str = JSON.stringify(util.inspect(thing))如果
console.log(JSON.stringify(object));
导致
TypeError: 循环对象值
那么你可能想这样打印：
var output = '';
for (property in object)
output += property + ': ' + object[property]+'; ';
console.log(output);
【讨论】：
可能是因为它只打印一层？ 非常简单，我对此表示赞同，因为它在 chrome 中开箱即用。优秀【参考方案7】：请注意，Douglas Crockford 还实现了一个JSON.decycle 方法。见他的
cycle.js。这允许您对几乎任何标准结构进行字符串化：
var a = [];
a[0] = a;
a[1] = 123;
console.log(JSON.stringify(JSON.decycle(a)));
// result: '["$ref":"$",123]'.
您还可以使用retrocycle 方法重新创建原始对象。因此，您不必从对象中删除循环来对它们进行字符串化。
但是，这不适用于 DOM 节点（这是现实生活用例中循环的典型原因）。例如这会抛出：
var a = [document.body];
console.log(JSON.stringify(JSON.decycle(a)));
我已经创建了一个 fork 来解决这个问题（请参阅我的 cycle.js fork）。这应该可以正常工作：
var a = [document.body];
console.log(JSON.stringify(JSON.decycle(a, true)));
请注意，在我的 fork 中 JSON.decycle(variable) 的工作方式与原始版本一样，并且当 variable 包含 DOM 节点/元素时会引发异常。
当您使用JSON.decycle(variable, true) 时，您接受结果不可逆的事实（retrocycle 不会重新创建 DOM 节点）。不过，DOM 元素在某种程度上应该是可识别的。例如，如果 div 元素有一个 id，那么它将被替换为字符串 "div#id-of-the-element"。
【讨论】：
当我使用他的代码和你的代码时，它们都会给我一个“RangeError: Maximum call stack size exceeded”。 如果您在 Fiddle 上提供代码或在 Github 上添加问题，我可以看看：github.com/Eccenux/JSON-js/issues 这就是我要找的。JSON.decycle(a, true) 当你将 true 作为参数传递给 decycle 函数时会发生什么。
@Rudra true 使 fork 中的 stringifyNodes 选项为 true。这将转储例如div 带有 id="some-id" 到字符串：div#some-id。你会避免一些问题，但你不能完全回溯。
有npm包npmjs.com/package/json-js，但是有一段时间没更新了【参考方案8】：
我建议从@isaacs 中查看json-stringify-safe——它在 NPM 中使用。
顺便说一句 - 如果您不使用 Node.js，您可以从 relevant part of the source code 复制并粘贴第 4-27 行。
安装：
$ npm install json-stringify-safe --save
使用方法：
// Require the thing
var stringify = require('json-stringify-safe');
// Take some nasty circular object
var theBigNasty =
a: "foo",
b: theBigNasty
;
// Then clean it up a little bit
var sanitized = JSON.parse(stringify(theBigNasty));
这会产生：
a: 'foo',
b: '[Circular]'
请注意，就像@Rob W 提到的vanilla JSON.stringify 函数一样，您还可以通过将“替换器”函数作为第二个参数传递给
stringify()来自定义清理行为。如果您发现自己需要一个简单的示例来说明如何执行此操作，我刚刚编写了一个自定义替换器，它将错误、正则表达式和函数强制转换为人类可读的字符串 here。
【讨论】：
我喜欢这个解决方案，因为它解决的问题比其他解决方案的限制更少。它避免了：1) 仅在 NodeJS 上工作，2) 删除重复项而不仅仅是循环，3) 输出具有非标准整体结构的 JSON。它在 npm 上也被很好地打包，但源代码又好又短（允许简单的复制粘贴）。【参考方案9】：使用此类对象解决此问题的另一种解决方案是使用此库
https://github.com/ericmuyser/stringy
它很简单，您可以通过几个简单的步骤解决这个问题。
【讨论】：
【参考方案10】：var a=b:"b";
a.a=a;
JSON.stringify(preventCircularJson(a));
评估为：
""b":"b","a":"CIRCULAR_REFERENCE_REMOVED""
功能：
/**
* Traverses a javascript object, and deletes all circular values
* @param source object to remove circular references from
* @param censoredMessage optional: what to put instead of censored values
* @param censorTheseItems should be kept null, used in recursion
* @returns undefined
*/
function preventCircularJson(source, censoredMessage, censorTheseItems)
//init recursive value if this is the first call
censorTheseItems = censorTheseItems || [source];
//default if none is specified
censoredMessage = censoredMessage || "CIRCULAR_REFERENCE_REMOVED";
//values that have allready apeared will be placed here:
var recursiveItems = ;
//initaite a censored clone to return back
var ret = ;
//traverse the object:
for (var key in source)
var value = source[key]
if (typeof value == "object")
//re-examine all complex children again later:
recursiveItems[key] = value;
else
//simple values copied as is
ret[key] = value;
//create list of values to censor:
var censorChildItems = [];
for (var key in recursiveItems)
var value = source[key];
//all complex child objects should not apear again in children:
censorChildItems.push(value);
//censor all circular values
for (var key in recursiveItems)
var value = source[key];
var censored = false;
censorTheseItems.forEach(function (item)
if (item === value)
censored = true;
);
if (censored)
//change circular values to this
value = censoredMessage;
else
//recursion:
value = preventCircularJson(value, censoredMessage, censorChildItems.concat(censorTheseItems));
ret[key] = value
return ret;
【讨论】：
有效，但比它可能的要详细得多。【参考方案11】：我找到了circular-json library on github，它很好地解决了我的问题。
一些我觉得有用的好功能：
支持多平台使用，但目前我只用 node.js 测试过。 API 相同，因此您只需将其包含在内并将其用作 JSON 替换。 它有自己的解析方法，因此您可以将“循环”序列化数据转换回对象。【讨论】：
这个库对我抛出了一个错误，所以我必须寻找另一个。错误 TypeError: toISOString is not a function at String.toJSON () at Object. (localhost:8100/build/polyfills.js:1:3458) at JSON.stringify () at Object.stringifyRecursion [as stringify] (localhost:8100/build/main.js:258450:15) @MarkEllul 我在 2015 年写了评论，如果我能看到更好的选择，我会在这里发布并进行编辑。我偶尔在日常工作中仍然会遇到同样的问题，我通常更喜欢我自己的手动功能以递归方式进行适当/安全的检查。如果您不熟悉，我建议您检查一下函数式编程实践，通常情况下，它会简化这种递归操作，因为它不那么棘手且更可靠。 还得到“toISOString 不是函数”，试图将事件字符串化并在 cypress 测试中重新发送 是的，它在 2013 年运行良好。需要更新【参考方案12】：我知道这是一个老问题，但我想推荐一个我创建的名为 smart-circular 的 NPM 包，它的工作方式与建议的其他方式不同。如果您使用大而深的对象，它会特别有用。
一些特点是：
将对象内部的循环引用或简单的重复结构替换为导致其第一次出现的路径（不仅仅是字符串[circular]）；
通过在广度优先搜索中寻找循环，该包可确保此路径尽可能小，这在处理非常大且深的对象时非常重要，因为路径可能会变得非常长且难以找到跟随（JSON.stringify 中的自定义替换执行 DFS）；
允许个性化替换，方便简化或忽略对象中不太重要的部分；
最后，路径完全按照访问引用字段所需的方式编写，这可以帮助您进行调试。
【讨论】：
这很好，虽然它也删除了重复项，而不仅仅是循环链接。 （好吧，如果您将“循环”定义为意味着在没有保护措施的情况下进行深度优先递归，将导致调用堆栈多次/无限次遍历同一条目）有用途，但不是某些人所定义的“循环”（即导致无限递归）。【参考方案13】：我这样解决这个问题：
var util = require('util');
// Our circular object
var obj = foo: bar: null, a:a:a:a:a:a:a:hi: 'Yo!';
obj.foo.bar = obj;
// Generate almost valid JS object definition code (typeof string)
var str = util.inspect(b, depth: null);
// Fix code to the valid state (in this example it is not required, but my object was huge and complex, and I needed this for my case)
str = str
.replace(/<Buffer[ \w\.]+>/ig, '"buffer"')
.replace(/\[Function]/ig, 'function()')
.replace(/\[Circular]/ig, '"Circular"')
.replace(/\ \[Function: ([\w]+)]/ig, ' $1: function $1 () ,')
.replace(/\[Function: ([\w]+)]/ig, 'function $1()')
.replace(/(\w+): ([\w :]+GMT\+[\w \(\)]+),/ig, '$1: new Date("$2"),')
.replace(/(\S+): ,/ig, '$1: null,');
// Create function to eval stringifyed code
var foo = new Function('return ' + str + ';');
// And have fun
console.log(JSON.stringify(foo(), null, 4));
【讨论】：
这对我来说非常有用，但似乎类的代表就像_class: ClassName data: "here" ，所以我添加了以下规则.replace(/(\w+) /g, ' __ClassName__: "$1", ')。就我而言，我试图查看 http 请求对象的样子。【参考方案14】：
根据其他答案，我最终得到以下代码。它适用于循环引用、具有自定义构造函数的对象。
从给定的要序列化的对象，
缓存您在遍历对象时遇到的所有对象，并为每个对象分配一个唯一的 hashID（也可以使用自动递增的数字） 找到循环引用后，将新对象中的该字段标记为循环并将原始对象的 hashID 存储为属性。Github 链接 - DecycledJSON
DJSHelper = ;
DJSHelper.Cache = [];
DJSHelper.currentHashID = 0;
DJSHelper.ReviveCache = [];
// DOES NOT SERIALIZE FUNCTION
function DJSNode(name, object, isRoot)
this.name = name;
// [ATTRIBUTES] contains the primitive fields of the Node
this.attributes = ;
// [CHILDREN] contains the Object/Typed fields of the Node
// All [CHILDREN] must be of type [DJSNode]
this.children = []; //Array of DJSNodes only
// If [IS-ROOT] is true reset the Cache and currentHashId
// before encoding
isRoot = typeof isRoot === 'undefined'? true:isRoot;
this.isRoot = isRoot;
if(isRoot)
DJSHelper.Cache = [];
DJSHelper.currentHashID = 0;
// CACHE THE ROOT
object.hashID = DJSHelper.currentHashID++;
DJSHelper.Cache.push(object);
for(var a in object)
if(object.hasOwnProperty(a))
var val = object[a];
if (typeof val === 'object')
// IF OBJECT OR NULL REF.
/***************************************************************************/
// DO NOT REMOVE THE [FALSE] AS THAT WOULD RESET THE [DJSHELPER.CACHE]
// AND THE RESULT WOULD BE STACK OVERFLOW
/***************************************************************************/
if(val !== null)
if (DJSHelper.Cache.indexOf(val) === -1)
// VAL NOT IN CACHE
// ADD THE VAL TO CACHE FIRST -> BEFORE DOING RECURSION
val.hashID = DJSHelper.currentHashID++;
//console.log("Assigned", val.hashID, "to", a);
DJSHelper.Cache.push(val);
if (!(val instanceof Array))
// VAL NOT AN [ARRAY]
try
this.children.push(new DJSNode(a, val, false));
catch (err)
console.log(err.message, a);
throw err;
else
// VAL IS AN [ARRAY]
var node = new DJSNode(a,
array: true,
hashID: val.hashID // HashID of array
, false);
val.forEach(function (elem, index)
node.children.push(new DJSNode("elem", val: elem, false));
);
this.children.push(node);
else
// VAL IN CACHE
// ADD A CYCLIC NODE WITH HASH-ID
this.children.push(new DJSNode(a,
cyclic: true,
hashID: val.hashID
, false));
else
// PUT NULL AS AN ATTRIBUTE
this.attributes[a] = 'null';
else if (typeof val !== 'function')
// MUST BE A PRIMITIVE
// ADD IT AS AN ATTRIBUTE
this.attributes[a] = val;
if(isRoot)
DJSHelper.Cache = null;
this.constructorName = object.constructor.name;
DJSNode.Revive = function (xmlNode, isRoot)
// Default value of [isRoot] is True
isRoot = typeof isRoot === 'undefined'?true: isRoot;
var root;
if(isRoot)
DJSHelper.ReviveCache = []; //Garbage Collect
if(window[xmlNode.constructorName].toString().indexOf('[native code]') > -1 )
// yep, native in the browser
if(xmlNode.constructorName == 'Object')
root = ;
else
return null;
else
eval('root = new ' + xmlNode.constructorName + "()");
//CACHE ROOT INTO REVIVE-CACHE
DJSHelper.ReviveCache[xmlNode.attributes.hashID] = root;
for(var k in xmlNode.attributes)
// PRIMITIVE OR NULL REF FIELDS
if(xmlNode.attributes.hasOwnProperty(k))
var a = xmlNode.attributes[k];
if(a == 'null')
root[k] = null;
else
root[k] = a;
xmlNode.children.forEach(function (value)
// Each children is an [DJSNode]
// [Array]s are stored as [DJSNode] with an positive Array attribute
// So is value
if(value.attributes.array)
// ITS AN [ARRAY]
root[value.name] = [];
value.children.forEach(function (elem)
root[value.name].push(elem.attributes.val);
);
//console.log("Caching", value.attributes.hashID);
DJSHelper.ReviveCache[value.attributes.hashID] = root[value.name];
else if(!value.attributes.cyclic)
// ITS AN [OBJECT]
root[value.name] = DJSNode.Revive(value, false);
//console.log("Caching", value.attributes.hashID);
DJSHelper.ReviveCache[value.attributes.hashID] = root[value.name];
);
// [SEPARATE ITERATION] TO MAKE SURE ALL POSSIBLE
// [CYCLIC] REFERENCES ARE CACHED PROPERLY
xmlNode.children.forEach(function (value)
// Each children is an [DJSNode]
// [Array]s are stored as [DJSNode] with an positive Array attribute
// So is value
if(value.attributes.cyclic)
// ITS AND [CYCLIC] REFERENCE
root[value.name] = DJSHelper.ReviveCache[value.attributes.hashID];
);
if(isRoot)
DJSHelper.ReviveCache = null; //Garbage Collect
return root;
;
DecycledJSON = ;
DecycledJSON.stringify = function (obj)
return JSON.stringify(new DJSNode("root", obj));
;
DecycledJSON.parse = function (json, replacerObject)
// use the replacerObject to get the null values
return DJSNode.Revive(JSON.parse(json));
;
DJS = DecycledJSON;
示例用法 1：
var obj =
id:201,
box:
owner: null,
key: 'storm'
,
lines:[
'item1',
23
]
;
console.log(obj); // ORIGINAL
// SERIALIZE AND THEN PARSE
var jsonObj = DJS.stringify(obj);
console.log(DJS.parse(jsonObj));
示例用法 2：
// PERSON OBJECT
function Person()
this.name = null;
this.child = null;
this.dad = null;
this.mom = null;
var Dad = new Person();
Dad.name = 'John';
var Mom = new Person();
Mom.name = 'Sarah';
var Child = new Person();
Child.name = 'Kiddo';
Dad.child = Mom.child = Child;
Child.dad = Dad;
Child.mom = Mom;
console.log(Child); // ORIGINAL
// SERIALIZE AND THEN PARSE
var jsonChild = DJS.stringify(Child);
console.log(DJS.parse(jsonChild));
【讨论】：
【参考方案15】：只是做
npm i --save circular-json
然后在你的 js 文件中
const CircularJSON = require('circular-json');
...
const json = CircularJSON.stringify(obj);
https://github.com/WebReflection/circular-json
注意：我与这个包无关。但我确实使用它。
2020 年更新
请注意，CircularJSON 仅处于维护阶段，flatted 是它的继任者。
【讨论】：
非常感谢！很棒的图书馆，节省了大量时间。超小（缩小后仅 1.4KB）。 我认为你可能需要更多的理由来使用模块而不是“只是做”。而且原则上覆盖JSON也不好。
我需要复制一个对象以用于存根测试。这个答案很完美。我复制了对象，然后删除了覆盖。谢谢！！
根据作者的说法，这个包已经被弃用了。 CircularJSON 仅在维护中，flatted 是它的继任者。链接：github.com/WebReflection/flatted#flatted
当心，“扁平化”（和圆形 json？）包不复制 JSON.stringify() 功能。它创建自己的非 JSON 格式。 （例如，Flatted.stringify(blah: 1) 导致 ["blah":1]）我看到有人试图提出一个关于此的问题，作者斥责他们并将问题锁定给 cmets。【参考方案16】：
我知道这个问题很老，并且有很多很好的答案，但我发布这个答案是因为它有新的味道 (es5+)
Object.defineProperties(JSON,
refStringify:
value: function(obj)
let objMap = new Map();
let stringified = JSON.stringify(obj,
function(key, value)
// only for objects
if (typeof value == 'object')
// If has the value then return a reference to it
if (objMap.has(value))
return objMap.get(value);
objMap.set(value, `ref$objMap.size + 1`);
return value;
);
return stringified;
,
refParse:
value: function(str)
let parsed = JSON.parse(str);
let objMap = _createObjectMap(parsed);
objMap.forEach((value, key) => _replaceKeyWithObject(value, key));
return parsed;
,
);
// *************************** Example
let a =
b: 32,
c:
get a()
return a;
,
get c()
return a.c;
;
let stringified = JSON.refStringify(a);
let parsed = JSON.refParse(stringified, 2);
console.log(parsed, JSON.refStringify(parsed));
// *************************** /Example
// *************************** Helper
function _createObjectMap(obj)
let objMap = new Map();
JSON.stringify(obj, (key, value) =>
if (typeof value == 'object')
if (objMap.has(value))
return objMap.get(value);
objMap.set(value, `ref$objMap.size + 1`);
return value;
);
return objMap;
function _replaceKeyWithObject(key, obj, replaceWithObject = obj)
Object.keys(obj).forEach(k =>
let val = obj[k];
if (val == key)
return (obj[k] = replaceWithObject);
if (typeof val == 'object' && val != replaceWithObject)
_replaceKeyWithObject(key, val, replaceWithObject);
);
【讨论】：
【参考方案17】：@RobW 的回答是正确的，但这样更高效！因为它使用了 hashmap/set：
const customStringify = function (v)
const cache = new Set();
return JSON.stringify(v, function (key, value)
if (typeof value === 'object' && value !== null)
if (cache.has(value))
// Circular reference found
try
// If this value does not reference a parent it can be deduped
return JSON.parse(JSON.stringify(value));
catch (err)
// discard key if value cannot be deduped
return;
// Store value in our set
cache.add(value);
return value;
);
;
【讨论】：
对于具有循环引用的深层嵌套对象，请尝试 stringifyDeep => github.com/ORESoftware/safe-stringify Set 实现可能只是在底层使用了一个数组和 indexOf，但我还没有证实这一点。 这将删除具有不同值的子节点的父节点 - 例如 -"a":"b":"a":"d" 甚至删除具有空对象的节点
你能举个例子吗？创建一个 gist.github.com 之类的
优秀！！！首先（从顶部开始，但仅检查了 2-3 个功能解决方案）在 node.js 和 Fission 下的工作解决方案；-) - 库挂起。【参考方案18】：
试试这个：
var obj =
a: "foo",
b: obj
;
var circular_replacer = (value) =>
var seen = [];
if (value != null && typeof value == "object")
if (seen.indexOf(value) >= 0) return;
seen.push(value);
return value;
;
obj = circular_replacer(obj);
【讨论】：
在seen.push(value) =-D 之后不应该再多几行代码吗？喜欢for (var key in value) value[key] = circular_replacer(value[key]);
不鼓励使用纯代码的答案。请单击编辑并添加一些单词来总结您的代码如何解决问题，或者解释您的答案与之前的答案/答案有何不同。 From Review【参考方案19】：
JSON.stringify() 的第二个参数也 允许你指定一个键名数组，这些键名应该从它在数据中遇到的每个对象中保留下来。这可能不适用于所有用例，但却是一个更简单的解决方案。
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
var obj =
a: "foo",
b: this
var json = JSON.stringify(obj, ['a']);
console.log(json);
// "a":"foo"
注意：奇怪的是，来自 OP 的对象定义不会在最新的 Chrome 或 Firefox 中引发循环引用错误。此答案中的定义已修改，因此 确实 引发了错误。
【讨论】：
【参考方案20】：我想知道为什么还没有人发布proper solution from MDN page...
const getCircularReplacer = () =>
const seen = new WeakSet();
return (key, value) =>
if (typeof value === "object" && value !== null)
if (seen.has(value))
return;
seen.add(value);
return value;
;
;
JSON.stringify(circularReference, getCircularReplacer());
看到的值应该存储在一个集合中，而不是存储在数组中（替换器在每个元素上调用）并且没有必要尝试JSON.stringify 链中的每个元素都会导致循环引用。
与已接受的答案一样，此解决方案会删除所有重复值，而不仅仅是循环值。但至少它没有指数级的复杂性。
【讨论】：
很好，但这只是 ES2015。不支持 IE。 Yoda 说：“如果仍然支持 IE，那么应该使用转译器。”replacer = () => const seen = new WeakSet(); return (key, value) => if (typeof value === "object" && value !== null) if (seen.has(value)) return; seen.add(value); return value; ; () => const seen = new WeakSet(); return (key, value) => if (typeof value === "object" && value !== null) if (seen.has(value)) return; seen.add(value); … JSON.stringify(a:1, b: '2', replacer) 在 chrome 中返回 undefined
我收到错误 stack.get is not a function 与 express' Response 对象。 decycle 来自 github.com/douglascrockford/JSON-js/blob/master/cycle.js 工作。【参考方案21】：
尽管已经充分回答了这个问题，但您也可以在字符串化之前使用 delete 运算符显式删除有问题的属性。
delete obj.b;
const jsonObject = JSON.stringify(obj);
delete operator
这将消除构建或维护复杂逻辑以删除循环引用的需要。
【讨论】：
【参考方案22】：要更新覆盖 JSON 工作方式的答案（可能不推荐，但超级简单），请不要使用 circular-json（已弃用）。相反，使用后继者，扁平化：
https://www.npmjs.com/package/flatted
从@user1541685 上面的旧答案中借用，但替换为新答案：
npm i --save flatted
然后在你的 js 文件中
const CircularJSON = require('flatted');
const json = CircularJSON.stringify(obj);
【讨论】：
【参考方案23】：function myStringify(obj, maxDeepLevel = 2)
if (obj === null)
return 'null';
if (obj === undefined)
return 'undefined';
if (maxDeepLevel < 0 || typeof obj !== 'object')
return obj.toString();
return Object
.entries(obj)
.map(x => x[0] + ': ' + myStringify(x[1], maxDeepLevel - 1))
.join('\r\n');
【讨论】：
【参考方案24】：您可以尝试 JSON 解析器库：treedoc。它支持循环引用，还可以使用引用对重复的对象进行重复数据删除。
yarn add treedoc
import TD from 'treedoc'
TD.stringify(obj);
如果你想要更多的定制
import TD, TDEncodeOption from 'treedoc'
const opt = new TDEncodeOption();
opt.coderOption.setShowType(true).setShowFunction(true);
opt.jsonOption.setIndentFactor(2);
return TD.stringify(obj, opt);
生成的JSON文件可以通过查看器http://treedoc.org查看，支持通过JSON节点引用导航。
[无耻插件]我是这个库的作者
【讨论】：
【参考方案25】：此线程中的大多数答案都专门用于JSON.stringify - 它们没有显示如何实际删除原始对象树中的循环引用。 （好吧，之后再调用JSON.parse ——这需要重新分配，并且对性能有更高的影响）
要从源对象树中删除循环引用，您可以使用如下函数：https://***.com/a/63952549/2441655
这些通用的循环引用移除函数随后可用于对循环引用敏感函数（如JSON.stringify）的后续调用安全：
const objTree = normalProp: true;
objTree.selfReference = objTree;
RemoveCircularLinks(objTree); // without this line, the JSON.stringify call errors
console.log(JSON.stringify(objTree));
【讨论】：
【参考方案26】：我们使用object-scan 进行数据处理，这可能是一个可行的解决方案。这就是它的工作方式（也可以正确修剪数组）
// const objectScan = require('object-scan');
const prune = (data) => objectScan(['**'],
rtn: 'count',
filterFn: ( isCircular, parent, property ) =>
if (isCircular)
if (Array.isArray(parent))
parent.splice(property, 1);
else
delete parent[property];
return true;
return false;
,
breakFn: ( isCircular ) => isCircular === true
)(data);
const obj = a: 'foo', c: [0] ;
obj.b = obj;
obj.c.push(obj);
console.log(obj);
// => <ref *1> a: 'foo', c: [ 0, [Circular *1] ], b: [Circular *1]
console.log(prune(obj)); // returns circular counts
// => 2
console.log(obj);
// => a: 'foo', c: [ 0 ] .as-console-wrapper max-height: 100% !important; top: 0<script src="https://bundle.run/object-scan@17.1.0"></script>免责声明：我是object-scan的作者
【讨论】：
【参考方案27】：此代码将无法循环引用：
JSON.stringify(circularReference);
// TypeError: cyclic object value
使用下面的代码：
const getCircularReplacer = () =>
const seen = new WeakSet();
return (key, value) =>
if (typeof value === "object" && value !== null)
if (seen.has(value))
return;
seen.add(value);
return value;
;
;
JSON.stringify(circularReference, getCircularReplacer());
【讨论】：
这会删除所有使用过 2 次或更多次的对象，而不仅仅是引用【参考方案28】：我为我的 LoggingUtilities 类创建了以下方法。 以下方法获取源和目标对象，并通过给定的 maxLevel 将源分配给目标。
static assignObjectByLevel(
sourceObject: any,
targetObject: any,
currentLevel: number = 0,
maxLevel: number = 3,
showUndefinedValues = false
): any
if (currentLevel >= maxLevel)
return;
const objQueue = [];
for (const key in sourceObject)
if (sourceObject.hasOwnProperty(key))
const value = sourceObject[key];
if (typeof value === "object")
objQueue.push( key, value );
else
targetObject[key] = value;
else
if (showUndefinedValues)
targetObject[key] = "undefined/null";
while (objQueue.length > 0)
const objVal = objQueue.pop();
currentLevel++;
targetObject[objVal.key] = ;
this.assignObjectByLevel(
objVal.value,
targetObject[objVal.key],
currentLevel,
maxLevel,
false
);
用法示例：
const logObjParam =
level1: "value1",
level2:
value2: "value2",
level3:
value3: "value3",
level4:
value4: " value4",
level5:
value5: " value5",
,
,
,
,
;
let logObj = ;
this.assignObjectByLevel(logObjParam, logObj);
结果：
"level1": "value1",
"level2":
"value2": "value2",
"level3":
"value3": "value3",
"level4":
【讨论】：
以上是关于如何以类似 JSON 的格式打印圆形结构？的主要内容，如果未能解决你的问题，请参考以下文章
JavaScript打印JSON对象 - 树形结构输出 - 格式化JSON数组 - JS从一维数组 生成树形结构对象
JavaScript打印JSON对象 - 树形结构输出 - 格式化JSON数组 - JS从一维数组 生成树形结构对象