深入理解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 相关文章推荐
js 延迟加载 改变JS的位置加快网页加载速度
Dec 11 Javascript
JS 实现获取打开一个界面中输入的值
Mar 19 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
Aug 07 Javascript
js将控件隐藏及display属性的使用介绍
Dec 30 Javascript
jquery退出each循环的写法
Feb 26 Javascript
js 动态修改css文件的方法
Aug 05 Javascript
一个不错的js html页面倒计时可精确到秒
Oct 22 Javascript
Javascript中数组方法汇总(推荐)
Apr 01 Javascript
零基础之Node.js搭建API服务器的详解
Mar 08 Javascript
vue实现表格过滤功能
Sep 27 Javascript
js生成1到100的随机数最简单的实现方法
Feb 07 Javascript
微信小程序实现翻牌抽奖动画
Sep 21 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实现按文件名搜索文件的远程文件查找器
2014/05/10 PHP
ThinkPHP实现多数据库连接的解决方法
2014/07/01 PHP
PHP通过API获取手机号码归属地
2015/05/28 PHP
PHP使用Mysqli类库实现完美分页效果的方法
2016/04/07 PHP
PHP通过调用新浪API生成t.cn格式短网址链接的方法详解
2019/02/20 PHP
laravel dingo API返回自定义错误信息的实例
2019/09/29 PHP
laravel5.6实现数值转换
2019/10/23 PHP
地址栏传递中文参数乱码在js里用escape转码
2013/08/28 Javascript
nodejs实现遍历文件夹并统计文件大小
2015/05/28 NodeJs
vue 组件使用中的一些细节点
2018/04/25 Javascript
页面点击小红心js实现代码
2018/05/26 Javascript
浅谈Node框架接入ELK实践总结
2019/02/22 Javascript
微信小程序导航栏跟随滑动效果的实现代码
2019/05/14 Javascript
JS常见面试试题总结【去重、遍历、闭包、继承等】
2019/08/27 Javascript
vue使用codemirror的两种用法
2019/08/27 Javascript
JS实现简单打字测试
2020/06/24 Javascript
JavaScript判断数据类型有几种方法及区别介绍
2020/09/02 Javascript
JavaScript代码实现简单计算器
2020/12/27 Javascript
浅谈python函数之作用域(python3.5)
2017/10/27 Python
python处理自动化任务之同时批量修改word里面的内容的方法
2019/08/23 Python
python数据处理之如何选取csv文件中某几行的数据
2019/09/02 Python
python怎么判断模块安装完成
2020/06/19 Python
HTML5 Canvas如何实现纹理填充与描边(Fill And Stroke)
2013/07/15 HTML / CSS
前端H5 Video常见使用场景简介
2020/08/21 HTML / CSS
澳大利亚领先的在线美容商店:Facial Co
2017/10/22 全球购物
节省高达65%的城市景点费用:Go City
2019/07/06 全球购物
车辆转让协议书
2014/04/15 职场文书
2014年五四青年节演讲比赛方案
2014/04/22 职场文书
艺术设计专业求职自荐信
2014/05/19 职场文书
党委书记群众路线对照检查材料思想汇报
2014/10/04 职场文书
党的群众路线教育实践活动组织生活会发言材料
2014/10/17 职场文书
乡镇一岗双责责任书
2015/01/29 职场文书
关于远足的感想
2015/08/10 职场文书
2016幼儿园新学期寄语
2015/12/03 职场文书
如何书写读后感?(附范文)
2019/07/26 职场文书
星际争霸:毕姥爷vs解冻03
2022/04/01 星际争霸