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

天气晴朗,天空万里无云,温暖的阳光洒在人的身上,就像是一位母亲轻轻地抚摸着我们,微风徐徐,波光粼粼,站在美丽的湖边尽情享受大自然的无穷魅力。

本文实例讲述了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);可以深拷贝对象,拷贝之后,改变其中一个对象的属性值,对另外一个没有影响。

接着在继续深入理解

测试例子

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));

测试结果

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

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

到此这篇关于jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析就介绍到这了。能遇见就珍惜,遇不见就努力。更多相关jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!

您可能有感兴趣的文章
Django模板继承 extend标签实例代码详解

jQuery中extend函数简单用法示例

jQuery.extend 与 jQuery.fn.extend的用法及区别实例分析

angular.extend方法的具体使用

深入理解jquery的$.extend()、$.fn和$.fn.extend()