详解如何解决使用JSON.stringify时遇到的循环引用问题


Posted in Javascript onMarch 23, 2021

程序员在日常做TypeScript/JavaScript开发时,经常需要将复杂的JavaScript对象通过JSON.stringify序列化成json字符串,保存到本地以便后续具体分析。

详解如何解决使用JSON.stringify时遇到的循环引用问题

然而如果JavaScript对象本身包含循环引用,则JSON.stringify不能正常工作,错误消息:

VM415:1 Uncaught TypeError: Converting circular structure to JSON

详解如何解决使用JSON.stringify时遇到的循环引用问题

解决方案,使用下面这段来自这个网站的代码,定义一个全局cache数组,每当待序列化的JavaScript对象的属性被遍历时,将该属性对应的值存储到cache数组去。

如果遍历时发现,有属性值已经在cache数组里有值了,说明检测到了循环引用,此时直接return退出循环即可。

var cache = [];
var str = JSON.stringify(o, function(key, value) {
  if (typeof value === 'object' && value !== null) {
    if (cache.indexOf(value) !== -1) {
      // 移除
      return;
    }
    // 收集所有的值
    cache.push(value);
  }
  return value;
});
cache = null; // 清空变量,便于垃圾回收机制回收

使用这种办法,我成功将一个存在循环引用的JavaScript对象序列化成字符串了。

详解如何解决使用JSON.stringify时遇到的循环引用问题

Javascript 相关文章推荐
IE与FireFox中的childNodes区别
Oct 20 Javascript
取得元素的左和上偏移量的方法
Sep 17 Javascript
JS两种类型的表单提交方法实例分析
Nov 28 Javascript
浅析script标签中的defer与async属性
Nov 30 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
Dec 08 Javascript
jQuery实现别踩白块儿网页版小游戏
Jan 18 Javascript
javascript实现的图片预览功能
Mar 25 Javascript
从零开始学习Node.js系列教程四:多页面实现的数学运算示例
Apr 13 Javascript
jQuery实现的滑块滑动导航效果示例
Jun 04 jQuery
vue组件之间通信实例总结(点赞功能)
Dec 05 Javascript
node错误处理与日志记录的实现
Dec 24 Javascript
vue使用微信JS-SDK实现分享功能
Aug 23 Javascript
vue 中 get / delete 传递数组参数方法
Mar 23 #Vue.js
JavaScript实现页面动态验证码的实现示例
使用Vue.js和MJML创建响应式电子邮件
JS原生实现轮播图的几种方法
几款主流好用的富文本编辑器(所见即所得常用编辑器)介绍
vue+flask实现视频合成功能(拖拽上传)
Mar 04 #Vue.js
React服务端渲染原理解析与实践
Mar 04 #Javascript
You might like
php获取地址栏信息的代码
2008/10/08 PHP
发款php蜘蛛统计插件只要有mysql就可用
2010/10/12 PHP
PHP 二维关联数组根据其中一个字段排序(推荐)
2017/04/04 PHP
PHP常见数组排序方法小结
2018/08/20 PHP
深入学习微信网址链接解封的防封原理visit_type
2019/08/15 PHP
防止网站内容被拷贝的一些方法与优缺点好处与坏处分析
2007/11/30 Javascript
jQuery学习5 jQuery事件模型
2010/02/07 Javascript
Jquery中find与each方法用法实例
2015/02/04 Javascript
完美实现bootstrap分页查询
2015/12/09 Javascript
JavaScript、tab切换完整版(自动切换、鼠标移入停止、移开运行)
2016/01/05 Javascript
JavaScript Array对象详解
2016/03/01 Javascript
jQuery通过写入cookie实现更换网页背景的方法
2016/04/15 Javascript
JavaScript面向对象精要(上部)
2017/09/12 Javascript
解决在vue项目中webpack打包后字体不生效的问题
2018/09/01 Javascript
详解vue通过NGINX部署在子目录或者二级目录实践
2018/09/03 Javascript
vue 动态生成拓扑图的示例
2021/01/03 Vue.js
Vue 集成 PDF.js 实现 PDF 预览和添加水印的步骤
2021/01/22 Vue.js
python pickle 和 shelve模块的用法
2013/09/16 Python
Python中Random和Math模块学习笔记
2015/05/18 Python
Python中实现三目运算的方法
2015/06/21 Python
Swift 3.0在集合类数据结构上的一些新变化总结
2016/07/11 Python
Anaconda多环境多版本python配置操作方法
2017/09/12 Python
Python subprocess模块功能与常见用法实例详解
2018/06/28 Python
python中watchdog文件监控与检测上传功能
2020/10/30 Python
美国最便宜的旅游网站:CheapTickets
2017/07/09 全球购物
预订全球最佳旅行体验:Viator
2018/03/30 全球购物
Shopee新加坡:东南亚与台湾电商平台
2019/01/25 全球购物
参观监狱心得体会
2014/01/02 职场文书
高级编程求职信模板
2014/02/16 职场文书
英文产品推荐信
2015/03/27 职场文书
生日赠语
2015/06/23 职场文书
2015年大学组织委员个人工作总结
2015/10/23 职场文书
幼儿园小班开学寄语(2016秋季)
2015/12/03 职场文书
Nginx优化服务之网页压缩的实现方法
2021/03/31 Servers
教你用Python+selenium搭建自动化测试环境
2021/06/18 Python
简单聊聊Golang中defer预计算参数
2022/03/25 Golang