深入理解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遍历之parent()和parents()的区别及parentsUntil()方法详解
Dec 02 Javascript
js实现图片漂浮效果的方法
Mar 02 Javascript
js运动动画的八个知识点
Mar 12 Javascript
jQuery插件MixItUp实现动画过滤和排序
Apr 12 Javascript
javascript中for/in循环及使用技巧
Sep 01 Javascript
Angularjs中使用layDate日期控件示例
Jan 11 Javascript
JS处理一些简单计算题
Feb 24 Javascript
js提取中文拼音首字母的封装工具类
Mar 12 Javascript
vue通过点击事件读取音频文件的方法
May 30 Javascript
解决Vue动态加载本地图片问题
Oct 09 Javascript
vue 解决computed修改data数据的问题
Nov 06 Javascript
JavaScript函数Call、Apply原理实例解析
Feb 17 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读取html并截取字符串的简单代码
2009/11/30 PHP
php生成随机密码的三种方法小结
2010/09/04 PHP
php中opendir函数用法实例
2014/11/15 PHP
支持中文、字母、数字的PHP验证码
2015/05/04 PHP
PHP 双链表(SplDoublyLinkedList)简介和使用实例
2015/05/12 PHP
[原创]PHP正则删除html代码中a标签并保留标签内容的方法
2017/05/23 PHP
PDO::getAttribute讲解
2019/01/28 PHP
Auntion-TableSort国人写的一个javascript表格排序的东西
2007/11/12 Javascript
javascript event在FF和IE的兼容传参心得(绝对好用)
2014/07/10 Javascript
json字符串之间的相互转换示例代码
2014/08/21 Javascript
JS数组(Array)处理函数整理
2014/12/07 Javascript
node.js中的path.basename方法使用说明
2014/12/09 Javascript
node.js抓取并分析网页内容有无特殊内容的js文件
2015/11/17 Javascript
easyui validatebox验证
2016/04/29 Javascript
Bootstrap选项卡与Masonry插件的完美结合
2016/07/06 Javascript
Bootstrap CSS组件之输入框组
2016/12/17 Javascript
JavaScript文件的同步和异步加载的实现代码
2017/08/19 Javascript
妙用缓存调用链实现JS方法的重载
2018/04/30 Javascript
微信小程序地图绘制线段并且测量(实例代码)
2020/01/02 Javascript
vue中使用v-for时为什么不能用index作为key
2020/04/04 Javascript
python有证书的加密解密实现方法
2014/11/19 Python
python中使用 xlwt 操作excel的常见方法与问题
2019/01/13 Python
python 定时任务去检测服务器端口是否通的实例
2019/01/26 Python
python读csv文件时指定行为表头或无表头的方法
2019/06/26 Python
Python 异步协程函数原理及实例详解
2019/11/13 Python
在pytorch 中计算精度、回归率、F1 score等指标的实例
2020/01/18 Python
django中的数据库迁移的实现
2020/03/16 Python
详解使用canvas保存网页为pdf文件支持跨域
2018/11/23 HTML / CSS
英国最大的独立家具零售商:Furniture Village
2016/09/06 全球购物
香港士多网上超级市场:Ztore
2021/01/09 全球购物
对于没有初始化的变量的初始值可以作怎样的假定
2014/10/12 面试题
社会稳定风险评估方案
2014/06/02 职场文书
党员四风剖析材料
2014/08/27 职场文书
中国梦演讲稿开场白
2014/08/28 职场文书
买房协议书范本
2014/10/23 职场文书
2015年妇幼卫生工作总结
2015/05/23 职场文书