使用 $.extend 的 jQuery 深度/递归复制

Posted

技术标签:

【中文标题】使用 $.extend 的 jQuery 深度/递归复制【英文标题】:jQuery Deep/Recursive Copy using $.extend 【发布时间】:2012-03-05 15:33:54 【问题描述】:

我正在尝试使用 jQuery $.extend 合并两个对象。

使用以下代码,我试图提醒(“Ball – Stump – Umpire”)。但是当前的输出是(“未定义 - 树桩 - 裁判”)。它没有实现深度(递归)复制。我们如何纠正这个问题?

 $(document).ready(function () 

        debugger;

        //$.extend
        var obj3 =  throwable:  text1: 'Ball' , text3: 'Umpire' ;
        var obj4 =  throwable:  text4: 'Bat' , text2: 'Stump' 

        //Simple Copy
        var result1 = $.extend(obj3, obj4);
        //alert(result1.throwable.text4 + " - " + result1.text2 + " - " + result1.text3);


        //Deep Copy
        //First parameter is passed as Boolean true to accomplish deep (recursive) copy
        var result2 = $.extend(true, obj3, obj4);
        alert(result2.throwable.text1 + " - " + result2.text2 + " - " + result2.text3);


    );

编辑:我提到了

(Deep) copying an array using jQuery

【问题讨论】:

其中一个如何:asp.net.netjquery-uijquery-plugins与问题相关的标签?​​ 【参考方案1】:

您的第二个代码 sn-p 确实按预期工作,并将 obj4 的深层复制到 obj3在单独运行时

问题是,前面的代码 sn-p 已经将obj4 复制到obj3浅层,用obj4 中的obj4 完全覆盖了它的throwable 成员过程。因此,在该代码运行后,throwable.text1 不再存在于 obj3 中。

最初,obj3 是:

 throwable:  text1: 'Ball' , text3: 'Umpire' 

第一个代码 sn-p 运行后,obj3 变为:

 throwable:  text4: 'Bat' , text3: 'Umpire', text2: 'Slump' 

最后,在第二个代码 sn-p 运行后,obj3 仍然是:

 throwable:  text4: 'Bat' , text3: 'Umpire', text2: 'Slump' 

【讨论】:

【参考方案2】:

在您的代码中,text1 属性被 extend 覆盖。如果您想要一个连接字符串的方法,请编写您自己的代码,extend 不要那样做。

类似:

function(o1, o2) 
  var ores = ;
  for(var p in o1) ores.p = o1.p;
  for(var p in o2) ores.p = ores.p ? ores.p+o2.p : o2.p;
  return ores;

【讨论】:

@Lijo 如果你想看看区别:see 进行递归合并不会连接 srting ! 所以现在看来​​……有什么问题? alert(result2.throwable.text1 +" - "+ result2.throwable.text4 + " - " + result2.text2 + " - " + result2.text3); 给我“球 - 蝙蝠 - 树桩 - 裁判”【参考方案3】:

问题是,对象中有两个同名的属性:text1。即使使用深度扩展,jquery 扩展也不会将其合并到新的 concat 字符串或数组中。

如果您的属性之一是另一个对象,则深拷贝是相关的。通过深度扩展,子对象的所有属性都会被合并,而不仅仅是子对象本身。

我认为您必须使用自己的扩展功能。

【讨论】:

以上是关于使用 $.extend 的 jQuery 深度/递归复制的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript 传播语法与 jQuery $.extend - ByRef 和 ByVal

jQuery常用方法

实现对象合并功能

jQuery $.extend()使用方法

jQuery使用(十四):extend()方法

jquery源码学习之extend