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

Question

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

使用以下代码，我尝试发出警报(“球 - 树桩 - 裁判”)。但当前的输出是(“Undefined – 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

Answer 1

您的第二个代码片段确实按预期工作，并在隔离运行时将 obj4 深度复制到 obj3。

>

问题是，前面的代码片段已经执行了 obj4 到 obj3 的浅复制，完全覆盖了它的 throwable 成员在进程中具有 obj4。因此，在该代码运行后，throwable.text1 在 obj3 中不再存在。

• 最初，obj3 是:

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

• 第一个代码片段运行后，obj3 变为:

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

• 最后，在第二个代码段运行后，obj3 仍然是:

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