深入理解JavaScript中的对象复制(Object Clone)


Posted in Javascript onMay 18, 2016

JavaScript中并没有直接提供对象复制(Object Clone)的方法。因此下面的代码中改变对象b的时候,也就改变了对象a。

a = {k1:1, k2:2, k3:3};

b = a;

b.k2 = 4;

如果只想改变b而保持a不变,就需要对对象a进行复制。

用jQuery进行对象复制

在可以使用jQuery的情况下,jQuery自带的extend方法可以用来实现对象的复制。

a = {k1:1, k2:2, k3:3};

b = {};

$.extend(b,a);

自定义clone()方法来实现对象复制

下面的方法,是对象复制的基本想法。

Object.prototype.clone = function() {
 var copy = (this instanceof Array) ? [] : {};
 for (attr in this) {
  if (!obj.hasOwnProperty(attr)) continue;
  copy[attr] = (typeof this[i] == "object")?obj[attr].clone():obj[attr];
 } 
 return copy;
};


a = {k1:1, k2:2, k3:3};
b = a.clone();

下面的例子则考虑的更全面些,适用于大部分对象的深度复制(Deep Copy)。

function clone(obj) {
  // Handle the 3 simple types, and null or undefined
  if (null == obj || "object" != typeof obj) return obj;

  // Handle Date
  if (obj instanceof Date) {
    var copy = new Date();
    copy.setTime(obj.getTime());
    return copy;
  }

  // Handle Array
  if (obj instanceof Array) {
    var copy = [];
    for (var i = 0, var len = obj.length; i < len; ++i) {
      copy[i] = clone(obj[i]);
    }
    return copy;
  }

  // Handle Object
  if (obj instanceof Object) {
    var copy = {};
    for (var attr in obj) {
      if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
    }
    return copy;
  }

  throw new Error("Unable to copy obj! Its type isn't supported.");
}

以上这篇深入理解JavaScript中的对象复制(Object Clone)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于Jquery实现表格动态分页实现代码
Jun 21 Javascript
zShowBox 图片放大展示jquery版 兼容性
Sep 24 Javascript
Jquery中offset()和position()的区别分析
Feb 05 Javascript
window.close(); 关闭浏览器窗口js代码的总结介绍
Jul 14 Javascript
js 递归和定时器的实例解析
Feb 03 Javascript
vue.js动态数据绑定学习笔记
May 19 Javascript
手写简单的jQuery雪花飘落效果实例
Apr 22 jQuery
node中modules.exports与exports导出的区别
Jun 08 Javascript
JS简单判断是否在微信浏览器打开的方法示例
Jan 08 Javascript
Vuex 模块化使用详解
Jul 31 Javascript
JS+html5实现异步上传图片显示上传文件进度条功能示例
Nov 09 Javascript
JavaScript创建表格的方法
Apr 13 Javascript
js验证框架实现代码分享
May 18 #Javascript
在JavaScript中对HTML进行反转义详解
May 18 #Javascript
深入理解JavaScript中的浮点数
May 18 #Javascript
Node.js返回JSONP详解
May 18 #Javascript
noty ? jQuery通知插件全面解析
May 18 #Javascript
Avalon中文长字符截取、关键字符隐藏、自定义过滤器
May 18 #Javascript
jQuery实现图片向左向右切换效果的简单实例
May 18 #Javascript
You might like
PHP安装攻略:常见问题解答(二)
2006/10/09 PHP
30个php操作redis常用方法代码例子
2014/07/05 PHP
php实现文件预览功能
2017/05/23 PHP
jquery last-child 列表最后一项的样式
2010/01/22 Javascript
『jQuery』取指定url格式及分割函数应用
2013/04/22 Javascript
浅谈EasyUI中编辑treegrid的方法
2015/03/01 Javascript
使用JQuery FancyBox插件实现图片展示特效
2015/11/16 Javascript
每天一篇javascript学习小结(面向对象编程)
2015/11/20 Javascript
解决jQuery使用JSONP时产生的错误
2015/12/02 Javascript
鼠标经过出现气泡框的简单实例
2017/03/17 Javascript
使用Vue实现图片上传的三种方式
2018/07/17 Javascript
Vue.js 中 axios 跨域访问错误问题及解决方法
2018/11/21 Javascript
[01:13]2014DOTA2西雅图邀请赛 舌尖上的TI4
2014/07/08 DOTA
[02:36]DOTA2上海特锦赛 回忆电竞生涯的重要瞬间
2016/03/25 DOTA
[00:32]2018DOTA2亚洲邀请赛Newbee出场
2018/04/03 DOTA
python通过apply使用元祖和列表调用函数实例
2015/05/26 Python
Python socket套接字实现C/S模式远程命令执行功能案例
2018/07/06 Python
Python调用adb命令实现对多台设备同时进行reboot的方法
2018/10/15 Python
VSCode Python开发环境配置的详细步骤
2019/02/22 Python
Python日期格式和字符串格式相互转换的方法
2020/02/18 Python
Python3使用xlrd、xlwt处理Excel方法数据
2020/02/28 Python
使用python实现微信小程序自动签到功能
2020/04/27 Python
python实现二分查找算法
2020/09/18 Python
python在linux环境下安装skimage的示例代码
2020/10/14 Python
网页布局中CSS样式无效的十个重要原因详解
2017/08/10 HTML / CSS
Topman美国官网:英国著名的国际平价时尚男装品牌
2017/12/22 全球购物
Aosom西班牙:家具在线商店
2020/06/11 全球购物
意大利单身交友网站:Meetic
2020/07/12 全球购物
SQL Server面试题
2013/04/04 面试题
Linux的文件类型
2012/03/07 面试题
文秘大学生求职信
2014/02/25 职场文书
校园主题婚礼活动策划方案
2014/09/15 职场文书
2015年副班长工作总结
2015/05/15 职场文书
校园安全主题班会
2015/08/12 职场文书
python基于OpenCV模板匹配识别图片中的数字
2021/03/31 Python
一文解答什么是MySQL的回表
2022/08/05 MySQL