JavaScript基于遍历操作实现对象深拷贝功能示例

 更新时间:2019年03月05日 10:33:07   作者:白杨-M  
这篇文章主要介绍了JavaScript基于遍历操作实现对象深拷贝功能,涉及javascript元素遍历与属性操作相关实现技巧,需要的朋友可以参考下

本文实例讲述了JavaScript基于遍历操作实现对象深拷贝功能。分享给大家供大家参考,具体如下:

function getType(o){
  var _t;
  return ((_t = typeof(o)) == "object" ? o==null && "null" || Object.prototype.toString.call(o).slice(8,-1):_t).toLowerCase();
}
function extend(destination,source){
  for(var p in source){
    if(getType(source[p])=="array"||getType(source[p])=="object"){
      destination[p]=getType(source[p])=="array"?[]:{};
      arguments.callee(destination[p],source[p]);
    }else{
      destination[p]=source[p];
    }
  }
}
var test={
  a:"ss",
  b:"dd",
  c:[
    {d:"css",e:"cdd"},
    {
      m:"ff",
      n:[
        {kk:"11",jj:"22"},
        {ll:"44"}
      ]
    }
  ]
};
var test1={};
extend(test1,test);
console.log(test);
console.log(test1);
test1.c[1].n[0].kk="change"; //改变test1的c属性对象的d属性
console.log(test);
console.log(test1);
console.log(test.c[1].n[0]);
console.log(test1.c[1].n[0]);

测试结果

从测试结果可以看到,通过使用这个遍历的方法,成功将对象test深拷贝复制一份,得到test1。并且更改test1对象的属性,并不会对test对象产生影响。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

希望本文所述对大家JavaScript程序设计有所帮助。

相关文章

  • JS基于ocanvas插件实现的简单画板效果代码(附demo源码下载)

    JS基于ocanvas插件实现的简单画板效果代码(附demo源码下载)

    这篇文章主要介绍了JS基于ocanvas插件实现的简单画板效果,结合实例形式分析了ocanvas插件实现画板的相关技巧,并附代码demo源码供读者下载参考,需要的朋友可以参考下
    2016-04-04
  • JS promise 的回调和 setTimeout 的回调到底谁先执行

    JS promise 的回调和 setTimeout 的回调到底谁先执行

    本文主要介绍了JS promise 的回调和 setTimeout 的回调到底谁先执行,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-01-01
  • 原生js实现页面滚动动画

    原生js实现页面滚动动画

    这篇文章主要为大家详细介绍了原生js实现页面滚动动画,使用了requestAnimationFrame,文中示例代码介绍的非常详细,具有一定的参考价值,感为兴趣的小伙伴们可以参考一下
    2022-01-01
  • js对图片base64编码字符串进行解码并输出图像示例

    js对图片base64编码字符串进行解码并输出图像示例

    这篇文章主要介绍了js对图片base64编码字符串进行解码并输出图像的具体实现,大家可以参考下面的示例
    2014-03-03
  • 浅析Bootstrap表格的使用

    浅析Bootstrap表格的使用

    Bootstrap - 简洁、直观、强悍、移动设备优先的前端开发框架,让web开发更迅速、简单。下面给大家介绍Bootstrap表格的使用的相关知识,非常不错,具有参考借鉴价值,感兴趣的朋友一起学习吧
    2016-06-06
  • js实现统计字符串中特定字符出现个数的方法

    js实现统计字符串中特定字符出现个数的方法

    这篇文章主要介绍了js实现统计字符串中特定字符出现个数的方法,涉及javascript针对字符串中字符运算操作相关技巧,需要的朋友可以参考下
    2016-08-08
  • KnockoutJS数组比较算法实例详解

    KnockoutJS数组比较算法实例详解

    这篇文章主要介绍了KnockoutJS数组比较算法实例详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-11-11
  • JavaScript中好用的数组对象排序方法分享

    JavaScript中好用的数组对象排序方法分享

    在日常工作中,我们经常需要对数组对象进行排序,尤其是在处理数据可视化需求中。本文将介绍一些简单而又实用的方法,帮助你实现对数组对象的某几个 key 进行排序
    2023-05-05
  • javascript实现随机显示星星特效

    javascript实现随机显示星星特效

    这篇文章主要介绍了javascript实现随机显示星星特效的相关资料,以一个完整实例形式较为详细的分析了js实现随机显示星星特效的实现技巧,需要的朋友可以参考下
    2016-01-01
  • Bootstrap基本插件学习笔记之Popover提示框(19)

    Bootstrap基本插件学习笔记之Popover提示框(19)

    这篇文章主要为大家详细介绍了Bootstrap基本插件学习笔记之Popover提示框的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12

最新评论