JSON.parse(JSON.stringify())深拷贝不会复制函数

  1. 深拷贝
    是指创建一个新对象,并递归地复制原对象中所有层级的属性和值,从而确保新对象与原对象完全独立

    深拷贝的实现方法 :

    1. 使用 `JSON.parse(JSON.stringify())
      函数会被忽略复制,比如,下面的对象的formatter函数深拷贝以后就不在了

      复制代码
       {
         name: "笔数",
         type: "value",
         axisLabel: {
           formatter: function (value) {
             console.log('value: ', value);
             return value + 'kg';
           }
         }
       },
  • JSON.parse(JSON.stringify())会导致:

  • 无法处理函数:函数会被忽略。

  • 无法处理特殊对象类型 :如 DateRegExpMapSet 等。

  • 无法处理循环引用:会抛出错误。

  • 丢失原型链 :新对象的原型链会被重置为 Object.prototype

  1. 浅拷贝
    只复制对象的第一层属性。如果属性值是对象(如 address),它会复制该属性值的对象的引用,而不是对象的内容

    复制代码
    const original = {
      age: 25,
      address: {
        city: "Moe",
      }
    };
    
    
    shallowCopy.address.street = "New Street";
    console.log(original.address.street); // 输出:New Street
相关推荐
牛奶7 分钟前
浏览器藏了这么多神器,你居然不知道?
前端·chrome·api
WebInfra12 分钟前
Rspack 2.0 正式发布!
前端·javascript·前端框架
极速蜗牛19 分钟前
Cursor最近变傻了?
前端
Han_han91919 分钟前
常用API:
java·开发语言
minji...23 分钟前
Linux 线程同步与互斥(四) POSIX信号量,基于环形队列的生产者消费者模型
linux·运维·服务器·c语言·开发语言·c++
码字小学妹29 分钟前
Claude Opus 4.7 接入指南(2026):国内配置 + xhigh 推理 + 成本计算
前端
小赵同学WoW31 分钟前
插槽【vue2】与 【vue3】对比
前端
代码随想录31 分钟前
Agent大厂面试题汇总:ReAct、Function Calling、MCP、RAG高频问题
前端·react.js·前端框架
前端那点事31 分钟前
Vue响应式原理|从底层实现到面试考点,一文吃透(Vue2+Vue3全解析)
前端·vue.js
walking95733 分钟前
Vite 打包优化终极指南:从 30MB 到 800KB 的性能飞跃
前端·vue.js·vite