深入理解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 相关文章推荐
node.js中的require使用详解
Dec 15 Javascript
浅析angularJS中的ui-router和ng-grid模块
May 20 Javascript
第四篇Bootstrap网格系统偏移列和嵌套列
Jun 21 Javascript
javascript鼠标滑过显示二级菜单特效
Nov 18 Javascript
微信小程序  自定义创建详细介绍
Oct 27 Javascript
利用js+css+html实现固定table的列头不动
Dec 08 Javascript
简单实现jquery焦点图
Dec 12 Javascript
bootstrap输入框组件使用方法详解
Jan 19 Javascript
使用vue与jquery实时监听用户输入状态的操作代码
Sep 19 jQuery
vue.js 实现评价五角星组件的实例代码
Aug 13 Javascript
茶余饭后聊聊Vue3.0响应式数据那些事儿
Oct 30 Javascript
vue transition 在子组件中失效的解决
Nov 12 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 FTP操作类代码( 上传、拷贝、移动、删除文件/创建目录)
2014/05/10 PHP
一个经典的PHP验证码类分享
2014/11/18 PHP
php计算2个日期的差值函数分享
2015/02/02 PHP
PHP安装threads多线程扩展基础教程
2015/11/17 PHP
PHP 实现从数据库导出到.csv文件方法
2017/07/06 PHP
laravel5.2表单验证,并显示错误信息的实例
2019/09/29 PHP
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
2011/03/03 Javascript
jQuery编辑器KindEditor4.1.4代码高亮显示设置教程
2013/03/01 Javascript
深入浅出讲解ES6的解构
2016/08/03 Javascript
input 禁止输入特殊字符的四种实现方式
2016/08/24 Javascript
分享bootstrap学习笔记心得(组件及其属性)
2017/01/11 Javascript
JavaScript简单验证表单空值及邮箱格式的方法
2017/01/20 Javascript
Vue渲染函数详解
2017/09/15 Javascript
vue组件实践之可搜索下拉框功能
2018/11/25 Javascript
JavaScript 判断iPhone X Series机型的方法
2019/01/28 Javascript
ES6中定义类和对象的方法示例
2019/07/31 Javascript
关于vue-cli3打包代码后白屏的解决方案
2020/09/02 Javascript
[01:44]《为梦想出发》—联想杯DOTA2完美世界全国高校联赛
2015/09/30 DOTA
[46:32]Fnatic vs OG 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
python里大整数相乘相关技巧指南
2014/09/12 Python
python中global用法实例分析
2015/04/30 Python
Python使用lxml模块和Requests模块抓取HTML页面的教程
2016/05/16 Python
Python编程把二叉树打印成多行代码
2018/01/04 Python
Python读取word文本操作详解
2018/01/22 Python
python 通过字符串调用对象属性或方法的实例讲解
2018/04/21 Python
python如何将两个txt文件内容合并
2019/10/18 Python
Python实现变声器功能(萝莉音御姐音)
2019/12/05 Python
Mankind西班牙男士护肤品网站:购买皮肤护理、护发和剃须
2017/04/27 全球购物
实习教师自我鉴定
2013/09/27 职场文书
小学教师师德师风自我剖析材料
2014/09/29 职场文书
公司授权委托书
2014/10/17 职场文书
2014年基层党建工作总结
2014/11/11 职场文书
好好学习保证书
2015/02/26 职场文书
我们的节日中秋节活动总结
2015/03/23 职场文书
安全生产学习心得体会
2016/01/18 职场文书
redis配置文件中常用配置详解
2021/04/14 Redis