深入理解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 相关文章推荐
DEFER怎么用?
Jul 01 Javascript
在线游戏大家来找茬II
Sep 30 Javascript
javascript 图片上一张下一张链接效果代码
Mar 12 Javascript
商城常用滚动的焦点图效果代码简单实用
Mar 28 Javascript
浅谈js的setInterval事件
Dec 05 Javascript
JS中split()用法(将字符串按指定符号分割成数组)
Oct 24 Javascript
微信小程序 icon组件详细及实例代码
Oct 25 Javascript
JS中判断null的方法分析
Nov 21 Javascript
学习使用bootstrap的modal和carousel
Dec 09 Javascript
Vue-Router实现页面正在加载特效方法示例
Feb 12 Javascript
vue+vuecli+webpack中使用mockjs模拟后端数据的示例
Oct 24 Javascript
一篇文章学会Vue中间件管道
Jun 20 Vue.js
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中怎样保持SESSION不过期 原理及方案介绍
2013/08/08 PHP
php中smarty模板条件判断用法实例
2015/06/11 PHP
浅谈php提交form表单
2015/07/01 PHP
ThinkPHP框架中使用Memcached缓存数据的方法
2018/03/31 PHP
PHP模糊查询技术实例分析【附源码下载】
2019/03/07 PHP
用于判断用户注册时,密码强度的JS代码
2009/01/01 Javascript
js 图片等比例缩放代码
2010/05/13 Javascript
FireFox下XML对象转化成字符串的解决方法
2011/12/09 Javascript
Extjs优化(二)Form表单提交通用实现
2013/04/15 Javascript
了不起的node.js读书笔记之node的学习总结
2014/12/22 Javascript
JS模式之简单的订阅者和发布者模式完整实例
2015/06/30 Javascript
浅析JavaScript声明变量
2015/12/21 Javascript
javascript时间排序算法实现活动秒杀倒计时效果
2021/01/28 Javascript
javascript实现PC网页里的拖拽效果
2016/03/14 Javascript
jQuery插件FusionCharts绘制的3D双柱状图效果示例【附demo源码】
2017/04/20 jQuery
详解Vue.js 2.0 如何使用axios
2017/04/21 Javascript
Angular中实现树形结构视图实例代码
2017/05/05 Javascript
jQuery实现节点的追加、替换、删除、复制功能示例
2017/07/11 jQuery
VUE2实现事件驱动弹窗示例
2017/10/21 Javascript
基于js 各种排序方法和sort方法的区别(详解)
2018/01/03 Javascript
Javascript将图片的绝对路径转换为base64编码的方法
2018/01/11 Javascript
vue子传父关于.sync与$emit的实现
2019/11/05 Javascript
谈谈JavaScript中的垃圾回收机制
2020/09/17 Javascript
Python多线程结合队列下载百度音乐的方法
2015/07/27 Python
PyQt5实现简单数据标注工具
2019/03/18 Python
python小程序之4名牌手洗牌发牌问题解析
2020/05/15 Python
伦敦的高级牛仔布专家:Trilogy
2018/08/06 全球购物
Wiggle美国:英国骑行、跑步、游泳、铁人三项商店
2018/10/27 全球购物
公司营业员的工作总结自我评价
2013/10/05 职场文书
医学生自荐信范文
2015/03/05 职场文书
小区环境卫生倡议书
2015/04/29 职场文书
2016高考感言
2015/08/01 职场文书
思品教学工作总结
2015/08/10 职场文书
周末问候语大全
2015/11/10 职场文书
2016年11月份红领巾广播稿
2015/12/21 职场文书
spring注解 @PropertySource配置数据源全流程
2022/03/25 Java/Android