博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js 对象 浅拷贝 和 深拷贝
阅读量:4488 次
发布时间:2019-06-08

本文共 1495 字,大约阅读时间需要 4 分钟。

网上发现一个比较好的博客 阮一峰的感觉很不错推荐大家看看。

http://www.ruanyifeng.com/blog/it/javascript/

接下来看一下这两个拷贝方法

1.浅拷贝

拷贝就是把父对像的属性,全部拷贝给子对象。

 下面这个函数,就是在做拷贝:

var Chinese = {  nation:'中国'}var Doctor = {  career:'医生'}  function extendCopy(p) {    var c = {};    for (var i in p) {       c[i] = p[i];    }    c.uber = p;    return c; }

 

使用的时候,这样写:

 var Doctor = extendCopy(Chinese);  Doctor.career = '医生';  alert(Doctor.nation); // 中国

但是,这样的拷贝有一个问题。那就是,如果父对象的属性等于数组或另一个对象,那么实际上,子对象获得的只是一个内存地址,而不是真正拷贝,因此存在父对象被篡改的可能。

请看,现在给Chinese添加一个"出生地"属性,它的值是一个数组。

Chinese.birthPlaces = ['北京','上海','香港'];

通过extendCopy()函数,Doctor继承了Chinese。

var Doctor = extendCopy(Chinese);

然后,我们为Doctor的"出生地"添加一个城市:

Doctor.birthPlaces.push('厦门');

看一下输入结果

  alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门  alert(Chinese.birthPlaces); //北京, 上海, 香港, 厦门

结果是两个的出生地都被改了。

所以,extendCopy() 只是拷贝了基本类型的数据,我们把这种拷贝叫做“浅拷贝”。

2.深拷贝

 因为浅深拷有如此弊端所以我们接下来看一下深拷贝

所谓"深拷贝",就是能够实现真正意义上的数组和对象的拷贝。它的实现并不难,只要递归调用"浅拷贝"就行了。

function deepCopy(p, c) {    var c = c || {};    for (var i in p) {      if (typeof p[i] === 'object') {        c[i] = (p[i].constructor === Array) ? [] : {};        deepCopy(p[i], c[i]);      } else {         c[i] = p[i];      }    }    return c;  }

看一下使用方法:

  var Doctor = deepCopy(Chinese);

现在,给父对象加一个属性,值为数组。然后,在子对象上修改这个属性:

Chinese.birthPlaces = ['北京','上海','香港'];Doctor.birthPlaces.push('厦门');alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门alert(Chinese.birthPlaces); //北京, 上海, 香港

这样就完成了拷贝;

 

jquery 中$.extend()如同。

转载于:https://www.cnblogs.com/benbentu/p/4923312.html

你可能感兴趣的文章
总结:
查看>>
spring boot 整合redis --sea 方式1
查看>>
Android Http请求方法汇总
查看>>
缓存技术PK:选择Memcached还是Redis?
查看>>
Laravel-lumen 配置JWT
查看>>
MySQL常用存储引擎:MyISAM与InnoDB之华山论剑
查看>>
MVC5+EF6 --自定义控制Action访问权限
查看>>
[CF786B] Legacy
查看>>
Spring 注解@Component,@Service,@Controller,@Repository
查看>>
设置RDLC中table控件的表头在每页显示
查看>>
linux中tomcat内存溢出解决办法 分类: 测试 ...
查看>>
jQuery $.each用法
查看>>
[Luogu 3902]Increasing
查看>>
clear语句处理不同类型的数据结果
查看>>
HDU 6118 度度熊的交易计划(费用流)
查看>>
UrlEncode编码/UrlDecode解码使用方法
查看>>
使用ubuntu作为web开发环境的一些感受
查看>>
easyui-datagrid 自适应列宽问题
查看>>
OO第一次总结
查看>>
VS2012发布网站详细步骤
查看>>