js深拷贝三种方法

使用递归函数实现深拷贝

javascript 复制代码
const obj = {
      name: 'zzz',
      age: 18,
      hobby: ['篮球', '足球'],
      family: {
        baby: 'baby'
      }
    }
// 深拷贝   数组  对象  一定要先筛数组再筛对象,因为万物皆对象
    function deepcopy(newObj, oldObj) {
      for (const k in oldObj) {
        // 判断值是否属于array类
        if (oldObj[k] instanceof Array) {
          // 先将newo中hobby置空  newObj[hobby]=[]
          newObj[k] = []
          // 然后再将旧数据的数组值拷贝给新的数组值  newObj[hobby]=oldObj[hobby]
          deepcopy(newObj[k], oldObj[k])
        } else if (oldObj[k] instanceof Object) {
          newObj[k] = {}
          deepcopy(newObj[k], oldObj[k])
        } else {
          //newObj[k] ===newObj.name  给对象添加新属性
          newObj[k] = oldObj[k]
        }
      }
    }
 const newo = {}
    deepcopy(newo, obj)
    console.log(newo);
    newo.age = 11
    newo.hobby[0] = '羽毛球'
    newo.family.baby = 'bbbb'
    console.log(obj);

使用lodash的_.cloneDeep方法实现深拷贝

官网下载lodash https://www.lodashjs.com/

javascript 复制代码
//引用
  <script src="./lodash.min.js"></script>
 // lodash库
    const obj_l = {
      name: 'zzz',
      age: 18,
      hobby: ['篮球', '足球'],
      family: {
        baby: 'baby'
      }
    }
    const o_l = _.cloneDeep(obj_l)

    o_l.age = 11
    o_l.hobby[0] = '羽毛球'
    o_l.family.baby = 'bbbb'
    console.log(o_l);
    console.log(obj_l);

使用json的JSON.parse()JSON.stringify()方法实现深拷贝

javascript 复制代码
    // json深拷贝
    const obj_j = {
      name: 'zzz',
      age: 18,
      hobby: ['篮球', '足球'],
      family: {
        baby: 'baby'
      }
    }
    // /JSON.stringify  将对象转为json字符串
    const o_j = JSON.parse(JSON.stringify(obj_j))
    o_j.age = 11
    o_j.hobby[0] = '羽毛球'
    o_j.family.baby = 'bbbb'
    console.log(o_j);
    console.log(obj_j);
相关推荐
子兮曰3 小时前
jev-ultrafast 深度解析:7 秒订机票的浏览器 Agent 是如何炼成的
前端·后端·agent
子兮曰3 小时前
Jev 爆发一周:7 秒 Agent 背后的 System One 生态与三场争议
前端·后端·ai编程
前端小万3 小时前
写公众号赚了 3000 块后,我做了一款叫 "一键成稿" 的软件
前端·微信小程序
爱勇宝3 小时前
ZCode 开源 24 小时:一份没有历史的账本,回答不了"有没有偷代码"
前端·后端·chatglm (智谱)
三十而立洋4 小时前
Cookie 详解:从产生到安全,一次讲透
前端·javascript
卡布鲁5 小时前
把一个 Vite + Vue3 应用塞进 qiankun (React + Umi3) 主站:十个坑的复盘
前端·javascript·react.js
李少兄5 小时前
JavaScript 隐式全局变量解析
javascript
汉堡大王95276 小时前
Jev:不是聊天机器人, 而是一个智能 if 语句
前端·人工智能·后端
梦想很大很大7 小时前
从运行事实到回归证据:Workrun 的 Telemetry 与 Evaluation 实践
前端·人工智能·后端
计算机魔术师7 小时前
Meta Muse agent 接入 Shopify 的 Shop Pay 实现代理式购物
前端