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插件FusionCharts绘制的3D双柱状图效果示例【附demo源码】
Apr 20 jQuery
jQuery实现动态添加、删除按钮及input输入框的方法
Apr 27 jQuery
jQuery extend()详解及简单实例
May 06 jQuery
jQuery使用bind函数实现绑定多个事件的方法
Oct 11 jQuery
jQuery自动或手动图片切换效果
Oct 11 jQuery
jQuery实现的粘性滚动导航栏效果实例【附源码下载】
Oct 19 jQuery
为jquery的ajax请求添加超时timeout时间的操作方法
Sep 04 jQuery
jquery+css实现Tab栏切换的代码实例
May 14 jQuery
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
Jun 06 jQuery
jQuery zTree插件快速实现目录树
Aug 16 jQuery
jquery向后台提交数组的代码分析
Feb 20 jQuery
jQuery实现二级导航菜单的示例
Sep 30 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
通过5个php实例细致说明传值与传引用的区别
2012/08/08 PHP
PHP设计模式之迭代器模式的深入解析
2013/06/13 PHP
php中如何判断一个网页请求是ajax请求还是普通请求
2013/08/10 PHP
PHP分页详细讲解(有实例)
2013/10/30 PHP
php配合jquery实现增删操作具体实例
2013/12/12 PHP
Z-Blog中用到的js代码
2007/03/15 Javascript
jquery插件之easing 动态菜单
2010/08/21 Javascript
jquery根据name属性查找的小例子
2013/11/21 Javascript
给事件响应函数传参数的四种方式小结
2013/12/05 Javascript
js中window.open打开一个新的页面
2014/08/10 Javascript
仿淘宝TAB切换搜索框搜索切换的相关内容
2014/09/21 Javascript
javascript实现节点(div)名称编辑
2014/12/17 Javascript
JS实现兼容性较好的随屏滚动效果
2015/11/09 Javascript
Node.js返回JSONP详解
2016/05/18 Javascript
详解如何实现一个简单的Node.js脚手架
2017/12/04 Javascript
JavaScript使用递归和循环实现阶乘的实例代码
2018/08/28 Javascript
详解适配器在JavaScript中的体现
2018/09/28 Javascript
Python首次安装后运行报错(0xc000007b)的解决方法
2016/10/18 Python
Django应用程序中如何发送电子邮件详解
2017/02/04 Python
Python 模拟登陆的两种实现方法
2017/08/10 Python
Python实现图片转字符画的示例代码
2017/08/21 Python
python3使用pyqt5制作一个超简单浏览器的实例
2017/10/19 Python
python动态进度条的实现代码
2019/07/03 Python
python模拟鼠标点击和键盘输入的操作
2019/08/04 Python
在PyCharm中遇到pip安装 失败问题及解决方案(pip失效时的解决方案)
2020/03/10 Python
python3中sorted函数里cmp参数改变详解
2020/03/12 Python
python使用OpenCV模块实现图像的融合示例代码
2020/04/10 Python
Node.js 和 Python之间该选择哪个?
2020/08/05 Python
UNIX特点都有哪些
2016/04/05 面试题
阿德的梦教学反思
2014/02/06 职场文书
大型演出策划方案
2014/05/28 职场文书
房屋分割离婚协议书范本
2014/12/01 职场文书
公司年会开场白
2015/06/01 职场文书
2019年聘任书的写作格式及范文!
2019/07/03 职场文书
利用html+css实现菜单栏缓慢下拉效果的示例代码
2021/03/30 HTML / CSS
Win10鼠标轨迹怎么开 Win10显示鼠标轨迹方法
2022/04/06 数码科技