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 相关文章推荐
JQuery 遮罩层实现(mask)实现代码
Jan 09 Javascript
jQuery实现的一个自定义Placeholder属性插件
Aug 11 Javascript
js格式化时间小结
Nov 03 Javascript
js中的事件捕捉模型与冒泡模型实例分析
Jan 10 Javascript
JS使用ajax方法获取指定url的head信息中指定字段值的方法
Mar 24 Javascript
详细解读JavaScript的跨浏览器事件处理
Aug 12 Javascript
jQuery ajax中使用confirm,确认是否删除的简单实例
Jun 17 Javascript
js使用Replace结合正则替换重复出现的字符串功能示例
Dec 27 Javascript
vue 动态改变静态图片以及请求网络图片的实现方法
Feb 07 Javascript
解决Layui选择全部,换页checkbox复选框重新勾选的问题方法
Aug 14 Javascript
vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴的方法
Sep 05 Javascript
JavaScript原生数组函数实例汇总
Oct 14 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 SPL标准库的用法(遍历目录,查找固定条件的文件)
2013/06/18 PHP
深入剖析浏览器退出之后php还会继续执行么
2016/05/17 PHP
浅谈PHP的排列组合(如输入a,b,c 输出他们的全部组合)
2017/03/14 PHP
javascript 全角转换实现代码
2009/07/17 Javascript
jQuery点击自身以外地方关闭弹出层的简单实例
2013/12/24 Javascript
javascript创建createXmlHttpRequest对象示例代码
2014/02/10 Javascript
JavaScript动态提示输入框输入字数的方法
2015/07/27 Javascript
js图片轮播手动切换效果
2015/11/10 Javascript
javascript常用经典算法实例详解
2015/11/25 Javascript
jQuery设置单选按钮radio选中/不可用的实例代码
2016/06/24 Javascript
js提示框替代系统alert,自动关闭alert对话框的实现方法
2016/11/07 Javascript
详解使用nvm安装node.js
2017/07/18 Javascript
Angular项目中$scope.$apply()方法的使用详解
2017/07/26 Javascript
js点击时关闭该范围下拉菜单之外的菜单方法
2018/01/11 Javascript
网页爬虫之cookie自动获取及过期自动更新的实现方法
2018/03/06 Javascript
实用的Vue开发技巧
2019/05/30 Javascript
vue中选中多个选项并且改变选中的样式的实例代码
2020/09/16 Javascript
如何在JavaScript中使用localStorage详情
2021/02/04 Javascript
Python迭代用法实例教程
2014/09/08 Python
python自动化测试之setUp与tearDown实例
2014/09/28 Python
对python同一个文件夹里面不同.py文件的交叉引用方法详解
2018/12/15 Python
python按比例随机切分数据的实现
2019/07/11 Python
Python 字符串、列表、元组的截取与切片操作示例
2019/09/17 Python
使用python远程操作linux过程解析
2019/12/04 Python
pyinstaller将含有多个py文件的python程序做成exe
2020/04/29 Python
基于PyTorch中view的用法说明
2021/03/03 Python
亚历山大·王官网:Alexander Wang
2017/06/23 全球购物
Craghoppers德国官网:户外和旅行服装
2020/02/14 全球购物
茱莉蔻美国官网:Jurlique美国
2020/11/24 全球购物
环境工程毕业生自荐信
2013/11/17 职场文书
运动会邀请函范文
2014/02/06 职场文书
学生会招新策划书
2014/02/14 职场文书
2014年班组建设工作总结
2014/12/01 职场文书
2015年乡镇卫生院妇幼保健工作总结
2015/05/19 职场文书
交通安全教育主题班会
2015/08/12 职场文书
JavaScript中document.activeELement焦点元素介绍
2021/11/27 Javascript