当前位置: 首页 > news >正文

日常开发中,使用JSON.stringify来实现深拷贝的坑

使用JSON.stringify的方式来实现深拷贝的弊端

弊端一:无法拷贝NaN、Infinity、undefined这类值

在这里插入图片描述

无法拷贝成功的原因:

对于JSON来说,它支持的数据类型只有null、string、number、boolean、Object、Array,所以对于它不支持的数据类型就会自动转成null。

为什么undefined拷贝会丢失?

因为JSON不支持undefined这个数据类型,并且undefined相当于没有定义,所以就无法拷贝成功。
例如下图:我给obj.c设为undefined,但我没有给obj.tttttttttt设置任何值,它也是undefined。
在这里插入图片描述

弊端二:无法拷贝循环引用

什么是循环引用

如下图:目标对象的子孙属性中,赋值了目标对线,就会导致循环引用。
在这里插入图片描述

对循环对象使用JSON.stringify进行深拷贝时会出现报错

如下图所示:
在这里插入图片描述

解决方案

解决方案的话,一般就是使用第三方库的深拷贝方法处理啦。
不过下面我会介绍在自己手写深拷贝的时候,如何去解决循环引用问题(为了面试)。

先上代码:

function deepClone(target, mapObj = new WeakMap()) {let res;const typeStr = Object.prototype.toString.call(target);if(typeStr === '[object Object]') {res = {};} else if (typeStr === '[object Array]') {res = [];} else {return target;}Object.keys(target).forEach(key => {if(target.hasOwnProperty(key)) {if(typeof target[key] === 'object') {if (mapObj.get(target[key])) {res[key] = target[key]} else {mapObj.set(target[key], target[key]);res[key] = deepClone(target[key], mapObj);}} else {res[key] = target[key];}}})return res;
}

这里的话,主要是引用了weakMap来处理循环引用问题,因为weakMap支持key是一个对象。
手写deepClone的话,就无需兼容上面弊端一的问题了,因为js是支持NaN、Infinity这些数据类型的。

http://www.lryc.cn/news/538847.html

相关文章:

  • 【探商宝】:大数据与AI赋能,助力中小企业精准拓客引
  • Javascript网页设计案例:通过PDF.js实现一款PDF阅读器,包括预览、页面旋转、页面切换、放大缩小、黑夜模式等功能
  • 各类系统Pycharm安装教程
  • 哈希表(C语言版)
  • 内容中台驱动企业数字化内容管理高效协同架构
  • LLaMA-Factory DeepSeek-R1 模型 微调基础教程
  • vue 文件下载(导出)excel的方法
  • 【第4章:循环神经网络(RNN)与长短时记忆网络(LSTM)— 4.3 RNN与LSTM在自然语言处理中的应用案例】
  • LLMs Ollama
  • Blackbox.AI:高效智能的生产力工具新选择
  • 计算机专业知识【 轻松理解数据库四大运算:笛卡尔积、选择、投影与连接】
  • C/C++字符串格式化全解析:从printf到std::format的安全演进与实战指南
  • 【C++】stack 和 queue 的适配器模式与实现
  • 【python】You-Get
  • PHP基础部分
  • gitee SSH 公钥设置教程
  • Java零基础入门笔记:(3)程序控制
  • 鸡兔同笼问题
  • 【Pytorch 库】自定义数据集相关的类
  • electron打包基本教程
  • 实现pytorch注意力机制-one demo
  • 深入Flask:如何优雅地处理HTTP请求与响应
  • JVM ②-双亲委派模型 || 垃圾回收GC
  • jQuery介绍(快速、简洁JavaScript库,诞生于2006年,主要目标是简化HTML文档操作、事件处理、动画和Ajax交互)
  • python旅游推荐系统+爬虫+可视化(协同过滤算法)
  • Ubuntu 22.04.5 LTS 安装企业微信,(2025-02-17安装可行)
  • 【Excel笔记_6】条件格式和自定义格式设置表中数值超过100保留1位,超过1000保留0位,低于100为默认
  • UDP与TCP
  • Web开发技术概述
  • 解压rar格式的软件有哪些?8种方法(Win/Mac/手机/网页端)