深入理解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 相关文章推荐
WebGame《逆转裁判》完整版 代码下载(1月24日更新)
Jan 29 Javascript
HTML-CSS群中单选引发的“事件”
Mar 05 Javascript
使用TextRange获取输入框中光标的位置的代码
Mar 08 Javascript
cnblogs TagCloud基于jquery的实现代码
Jun 11 Javascript
javascript操作符&quot;!~&quot;详解
Feb 10 Javascript
PHP结合jQuery实现的评论顶、踩功能
Jul 22 Javascript
针对初学者的jQuery入门指南
Aug 15 Javascript
js实现select选择框效果及美化
Aug 19 Javascript
vue input输入框模糊查询的示例代码
May 22 Javascript
详解node字体压缩插件font-spider的用法
Sep 28 Javascript
2种在vue项目中使用百度地图的简单方法
Sep 28 Javascript
JavaScript Tab菜单实现过程解析
May 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
使用HMAC-SHA1签名方法详解
2013/06/26 PHP
简单谈谈PHP中的include、include_once、require以及require_once语句
2016/04/23 PHP
Windows下PHP开发环境搭建教程(Apache+PHP+MySQL)
2016/06/13 PHP
PHP实现QQ、微信和支付宝三合一收款码实例代码
2018/02/19 PHP
jquery插件如何使用 jQuery操作Cookie插件使用介绍
2012/12/15 Javascript
javascript检查浏览器是否支持flash的实现代码
2014/08/14 Javascript
jQuery中:not选择器用法实例
2014/12/30 Javascript
jQuery中:checkbox选择器用法实例
2015/01/03 Javascript
javascript获取文档坐标和视口坐标
2015/05/26 Javascript
jQuery实现form表单基于ajax无刷新提交方法详解
2015/12/08 Javascript
javascript 显示全局变量与隐式全局变量的区别
2017/02/09 Javascript
canvas时钟效果
2017/02/16 Javascript
vue事件修饰符和按键修饰符用法总结
2017/07/25 Javascript
jQuery条件分页 代替离线查询(附代码)
2017/08/17 jQuery
JavaScript中引用vs复制示例详析
2018/12/06 Javascript
新手简单了解vue
2019/05/29 Javascript
详解vue中v-on事件监听指令的基本用法
2020/07/22 Javascript
微信小程序实现拼图小游戏
2020/10/22 Javascript
Js利用正则表达式去除字符串的中括号
2020/11/23 Javascript
vue中实现点击空白区域关闭弹窗的两种方法
2020/12/30 Vue.js
python实现简单socket通信的方法
2016/04/19 Python
Python编写电话薄实现增删改查功能
2016/05/07 Python
Python部署web开发程序的几种方法
2017/05/05 Python
代码分析Python地图坐标转换
2018/02/08 Python
解决Python安装后pip不能用的问题
2018/06/12 Python
Python实现绘制双柱状图并显示数值功能示例
2018/06/23 Python
Python实现将数据写入netCDF4中的方法示例
2018/08/30 Python
15个Pythonic的代码示例(值得收藏)
2020/10/29 Python
利用canvas实现图片下载功能来实现浏览器兼容问题
2019/05/31 HTML / CSS
一套.net面试题及答案
2016/11/02 面试题
ShellScript面试题一则-ShellScript编程
2014/06/24 面试题
求职简历的自我评价怎样写好
2013/10/07 职场文书
大学生毕业的自我鉴定
2013/11/13 职场文书
道路建设实施方案
2014/03/18 职场文书
校园音乐节目广播稿
2015/08/19 职场文书
浅析Python实现DFA算法
2021/06/26 Python