javascript浅层克隆、深度克隆对比及实例解析


Posted in Javascript onFebruary 09, 2020

这篇文章主要介绍了javascript浅层克隆、深度克隆对比及实例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

1、浅层克隆, (引用值改变, 两个都一起变)

var obj = {
        name : 'xiaoming',
        age : 12,
        children : ['mimi','lili','rokey']
      }
      var obj2 = {};

      function clone(origin, target) {
        var target = target || {};
         for(var prop in origin) {
           target[prop] = origin[prop];
         }
         return target;
      }

      clone(obj, obj2);

2、深度克隆 (只考虑数组和对象)

(1)判断是不是原始值

 (2)判断是数组还是对象 Object.prototype.toString.call([]) = '[object Array]' Object.prototype.toString.call({}) = '[object Object]'

(3)建立相应的数组和对象

(4)递归

function deepClone(origin, target) {
        var target = target || {},
          toStr = Object.prototype.toString,
          arrStr = '[object Array]';
        for(var prop in origin) {
          if(origin.hasOwnProperty(prop)) {   //判断是不是对象自带的属性
            if(origin[prop] !== 'null' && typeof(origin[prop]) == 'object') {
              if(toStr.call(origin[prop]) == arrStr) {
                target[prop] = [];
              }else {
                target[prop] = {};
              }
              deepClone(origin[prop], target[prop]);
            }else {
              target[prop] = origin[prop];
            }
          }
        }
        return target;
      }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
检测是否已安装 .NET Framework 3.5的js脚本
Feb 14 Javascript
javascript 鼠标滚轮事件
Apr 09 Javascript
javascript DOM编程实例(智播客学习)
Nov 23 Javascript
通过js获取div的background-image属性
Oct 15 Javascript
用JavaScript实现类似于ListBox功能示例代码
Mar 09 Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
Oct 21 Javascript
JS+CSS模拟可以无刷新显示内容的留言板实例
Mar 03 Javascript
D3.js实现直方图的方法详解
Sep 25 Javascript
JS 对java返回的json格式的数据处理方法
Dec 05 Javascript
详解使用 Node.js 开发简单的脚手架工具
Jun 08 Javascript
JS实现transform实现扇子效果
Jan 17 Javascript
vue-router 2.0 跳转之router.push()用法说明
Aug 12 Javascript
通过javascript实现扫雷游戏代码实例
Feb 09 #Javascript
jQuery实现简单聊天室
Feb 08 #jQuery
jquery实现点击弹出对话框
Feb 08 #jQuery
jQuery实现简易聊天框
Feb 08 #jQuery
jquery添加div实现消息聊天框
Feb 08 #jQuery
js实现聊天对话框
Feb 08 #Javascript
jQuery实现聊天对话框
Feb 08 #jQuery
You might like
php生成EAN_13标准条形码实例
2013/11/13 PHP
dedecms函数分享之获取某一栏目所有子栏目
2014/05/19 PHP
彻底搞懂PHP 变量结构体
2017/10/11 PHP
用JavaScript实现UrlEncode和UrlDecode的脚本代码
2008/07/23 Javascript
js刷新框架子页面的七种方法代码
2008/11/20 Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件
2010/08/24 Javascript
window.onresize 多次触发的解决方法
2013/11/08 Javascript
Jquery创建一个层当鼠标移动到层上面不消失效果
2013/12/12 Javascript
js中Math之random,round,ceil,floor的用法总结
2013/12/26 Javascript
ie8本地图片上传预览示例代码
2014/01/12 Javascript
JQuery对表单元素的基本操作使用总结
2014/07/18 Javascript
Jquery实现图片预加载与延时加载的方法
2014/12/22 Javascript
javascript十六进制数字和ASCII字符之间的转换方法
2016/12/27 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
javascript 开发之百度地图使用到的js函数整理
2017/05/19 Javascript
基于iScroll实现下拉刷新和上滑加载效果
2017/07/18 Javascript
ejsExcel模板在Vue.js项目中的实际运用
2018/01/27 Javascript
基于elementUI实现图片预览组件的示例代码
2019/03/31 Javascript
微信小程序使用蓝牙小插件
2019/09/23 Javascript
Vue项目中Api的组织和返回数据处理的操作
2019/11/04 Javascript
JS继承实现方法及优缺点详解
2020/09/02 Javascript
python实现备份目录的方法
2015/08/03 Python
Python设计模式中单例模式的实现及在Tornado中的应用
2016/03/02 Python
Python面向对象之类和实例用法分析
2019/06/08 Python
解决Pyinstaller 打包exe文件 取消dos窗口(黑框框)的问题
2019/06/21 Python
Python Tornado批量上传图片并显示功能
2020/03/26 Python
css3中新增的样式使用示例附效果图
2014/08/19 HTML / CSS
利用CSS3制作简单的3d半透明立方体图片展示
2017/03/25 HTML / CSS
利用Canvas模仿百度贴吧客户端loading小球的方法示例
2017/08/13 HTML / CSS
英国巧克力贸易公司:Chocolate Trading Company
2017/03/21 全球购物
Abbott Lyon官网:女士手表、珠宝及配件
2020/12/26 全球购物
银行领导证婚词
2014/01/11 职场文书
《晏子使楚》教学反思
2014/02/08 职场文书
安全生产管理合理化建议书
2014/03/12 职场文书
少先队中队工作总结2015
2015/07/23 职场文书
Python机器学习之PCA降维算法详解
2021/05/19 Python