详解如何解决使用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 相关文章推荐
node.js中的dns.getServers方法使用说明
Dec 08 Javascript
ECMAScript 5严格模式(Strict Mode)介绍
Mar 02 Javascript
jQuery.Callbacks()回调函数队列用法详解
Jun 14 Javascript
Js操作DOM元素及获取浏览器高宽的简单方法
Sep 08 Javascript
浅谈jQuery before和insertBefore的区别
Dec 04 Javascript
纯JS实现简单的日历
Jun 26 Javascript
Vue 进入/离开动画效果
Dec 26 Javascript
angularjs使用gulp-uglify压缩后执行报错的解决方法
Mar 07 Javascript
JavaScript生成指定范围的时间列表
Mar 19 Javascript
详解微信小程序调用支付接口支付
Apr 28 Javascript
vue项目引入ts步骤(小结)
Oct 31 Javascript
Vue中watch、computed、updated三者的区别及用法
Jul 27 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中的i++与++i的区别及效率
2016/06/15 PHP
PHP编程中的Session阻塞问题与解决方法分析
2017/08/07 PHP
(仅IE下有效)关于checkbox 三态
2007/05/12 Javascript
javascript 时间比较实现代码
2009/10/28 Javascript
javascript中IE浏览器不支持NEW DATE()带参数的解决方法
2012/03/01 Javascript
js关闭浏览器窗口及检查浏览器关闭事件
2013/09/03 Javascript
jQuery中校验时间格式的正则表达式小结
2013/09/22 Javascript
简单实用的反馈表单无刷新提交带验证
2013/11/15 Javascript
javascript从右边截取指定字符串的三种实现方法
2013/11/29 Javascript
js简单的弹出框有关闭按钮
2014/05/05 Javascript
jquery获取选中的文本和值的方法
2014/07/08 Javascript
基于BootStrap Metronic开发框架经验小结【六】对话框及提示框的处理和优化
2016/05/12 Javascript
jquery css实现邮箱自动补全
2016/11/14 Javascript
浅析Jquery操作select
2016/12/13 Javascript
js实现不提示直接关闭网页窗口
2017/03/30 Javascript
vue-resouce设置请求头的三种方法
2017/09/12 Javascript
浅谈Vue-cli 命令行工具分析
2017/11/22 Javascript
axios发送post请求springMVC接收不到参数的解决方法
2018/03/05 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
2019/02/02 Javascript
vue data对象重新赋值无效(未更改)的解决方式
2020/07/24 Javascript
JS变量提升及函数提升实例解析
2020/09/03 Javascript
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
2020/11/16 Javascript
同时安装Python2 & Python3 cmd下版本自由选择的方法
2017/12/09 Python
Python字符串格式化%s%d%f详解
2018/02/02 Python
利用PyCharm Profile分析异步爬虫效率详解
2019/05/08 Python
Django错误:TypeError at / 'bool' object is not callable解决
2019/08/16 Python
HTML5 Canvas锯齿图代码实例
2014/04/10 HTML / CSS
机电专业个人求职信范文
2013/12/30 职场文书
大型营销活动计划书
2014/04/28 职场文书
汽车4S店销售经理岗位职责
2015/04/02 职场文书
开学第一周总结
2015/07/16 职场文书
导游词之西安骊山
2019/12/03 职场文书
python flask开发的简单基金查询工具
2021/06/02 Python
nginx结合openssl实现https的方法
2021/07/25 Servers
在 HTML 页面中使用 React的场景分析
2022/01/18 Javascript
Python+tkinter实现高清图片保存
2022/03/13 Python