jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析


Posted in jQuery onMarch 06, 2019

本文实例讲述了jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法。分享给大家供大家参考,具体如下:

语法:jQuery.extend( [deep ], target, object1 [, objectN ] )

深浅拷贝对应的参数就是[deep],是可选的,为true或false。默认情况是false(浅拷贝),并且false是不能够显示的写出来的。如果想写,只能写true(深拷贝)

测试例子:

var object1 = {};
var object2 = {
  b:{
    mm:333
  },
  c:100
};
console.log('原来的object1--->'+JSON.stringify(object1));
console.log('原来的object2--->'+JSON.stringify(object2));
$.extend(true,object1, object2);
object1.b.mm = 600;
console.log('新的object1--->'+JSON.stringify(object1));
console.log('新的object2--->'+JSON.stringify(object2));

测试结果

jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析

由测试结果知道,jQuery中$.extend(true,object1, object2);可以深拷贝对象,拷贝之后,改变其中一个对象的属性值,对另外一个没有影响。

接着在继续深入理解

测试例子

var object1 = {
  a: 0,
  b: {
    gg: 11,
    mm: 22
  }
};
var object2 = {
  b: {
    mm: 333
  },
  c: 100
};
//默认情况浅拷贝
//object1--->{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}
//object2的banner覆盖了object1的banner,但是weight属性未被继承
//$.extend(object1, object2);
//深拷贝
//object1--->{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}
//object2的banner覆盖了object1的banner,但是weight属性也被继承了呦
$.extend(true,object1, object2);
console.log('原来的object1--->'+JSON.stringify(object1));
console.log('原来的object2--->'+JSON.stringify(object2));
object1.b.mm = 600;
console.log('新的object1--->'+JSON.stringify(object1));
console.log('新的object2--->'+JSON.stringify(object2));

测试结果

jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
Jquery-data的三种用法
Apr 18 jQuery
jQuery使用正则验证15/18身份证的方法示例
Apr 27 jQuery
jQuery 循环遍历改变a标签的href(实例讲解)
Jul 12 jQuery
解决JQuery全选/反选第二次失效的问题
Oct 11 jQuery
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
jQuery 实现批量提交表格多行数据的方法
Aug 09 jQuery
layui中使用jquery控制radio选中事件的示例代码
Aug 15 jQuery
基于jquery实现九宫格拼图小游戏
Nov 30 jQuery
JQuery Ajax执行跨域请求数据的解决方案
Dec 10 jQuery
jquery中为什么能用$操作
Jun 18 jQuery
jQuery实现移动端下拉展现新的内容回弹动画
Jun 24 jQuery
jQuery实现日历效果
Sep 11 jQuery
[jQuery] 事件和动画详解
Mar 05 #jQuery
jQuery实现的导航条点击后高亮显示功能示例
Mar 04 #jQuery
Vue CLI3.0中使用jQuery和Bootstrap的方法
Feb 28 #jQuery
jQuery.parseJSON()函数详解
Feb 28 #jQuery
jQuery each和js forEach用法比较
Feb 27 #jQuery
jQuery中each和js中forEach的区别分析
Feb 27 #jQuery
原生JS forEach()和map()遍历的区别、兼容写法及jQuery $.each、$.map遍历操作
Feb 27 #jQuery
You might like
Yii2中设置与获取别名的函数(setAlias和getAlias)用法分析
2016/07/25 PHP
php实现博客,论坛图片防盗链的方法
2016/10/15 PHP
禁止刷新,回退的JS
2006/11/25 Javascript
利用腾讯的ip地址库做ip物理地址定位
2010/07/24 Javascript
js与运算符和或运算符的妙用
2014/02/14 Javascript
jQuery操作select下拉框的text值和value值的方法
2014/05/31 Javascript
深入理解JavaScript系列(26):设计模式之构造函数模式详解
2015/03/03 Javascript
javascript的 {} 语句块详解
2016/02/27 Javascript
jQuery实现产品对比功能附源码下载
2016/08/09 Javascript
JavaScript中Array对象用法实例总结
2016/11/29 Javascript
那些精彩的JavaScript代码片段
2017/01/12 Javascript
JavaScript实现快速排序的方法分析
2018/01/10 Javascript
ES6中Set和Map数据结构,Map与其它数据结构互相转换操作实例详解
2019/02/28 Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
2019/09/27 Javascript
python计算程序开始到程序结束的运行时间和程序运行的CPU时间
2013/11/28 Python
通过源码分析Python中的切片赋值
2017/05/08 Python
python 对txt中每行内容进行批量替换的方法
2018/07/11 Python
python采集微信公众号文章
2018/12/20 Python
python提取照片坐标信息的实例代码
2019/08/14 Python
使用Pandas的Series方法绘制图像教程
2019/12/04 Python
pytorch点乘与叉乘示例讲解
2019/12/27 Python
纯css3显示隐藏一个div特效的具体实现
2014/02/10 HTML / CSS
TUMI澳大利亚网站:美国旅行箱包品牌
2017/03/27 全球购物
高性能装备提升营地:Kammok
2019/02/27 全球购物
Python里面search()和match()的区别
2016/09/21 面试题
会计自荐书
2013/12/02 职场文书
应届毕业生求职信范文
2013/12/18 职场文书
工地门卫岗位职责
2013/12/30 职场文书
英语生日邀请函
2014/01/23 职场文书
主管竞聘书范文
2014/03/31 职场文书
公司新人试用期自我评价
2014/09/17 职场文书
公司副总经理岗位职责
2015/04/08 职场文书
幼儿园综治宣传月活动总结
2015/05/07 职场文书
周一给客户的问候语
2015/11/10 职场文书
一篇带你入门Java垃圾回收器
2021/06/16 Java/Android
Golang并发操作中常见的读写锁详析
2021/08/30 Golang