javascript - 如何正确合并两个对象数组？

我有一个包含对象的数组如下：

[
  {
    name: "test",
    sub: {
      name: "asdf",
      sub: {}
    }
  },
  {
    name: "models",
    sub: {}
  }
]

我还有以下对象：

{
  name: "test",
  sub: {
    name: "asdf",
    sub: {
      name: "inside_asdf",
      sub: {}
    }
  }
}

现在我想以某种方式把两者合并，这样我就能得到一个看起来像这样的数组：

[
  {
    name: "test",
    sub: {
      name: "asdf",
      sub: {
        name: "inside_asdf",
        sub: {}
      }
    }
  },
  {
    name: "models",
    sub: {}
  }
]

问题是我不知道如何做到这一点。我还希望它可以适用于任何数组深度，所以如果我想将一个数组合并到“inside_asdf”的子对象中，它也能工作。希望有人能帮我。我也已经尝试过 Object.merge，但这并没有输出所需的结果。对于任何信息或解决方案，我都非常感激。提前感谢。

##FIX##
我在下面标记了正确答案。然而，因为我用 TypeScript 在 React 中编写了整个应用程序，我找到了这个问题的另一个解决方案。

答案＃1

更新的答案给出了你想要的结果，无论如何，它使用了 jQuery、Prototype 的 $.extend。

并不是说我又一次把 aaaa 用 [] 数组标签包起来了，因为它需要具有相同的结构。

实现你想要的完整代码：

var data = [
  {
    name: "test",
    sub: {
      name: "asdf",
      sub: {}
    }
  },
  {
    name: "models",
    sub: {}
  }
];

var aaaa = [{
    name: "test",
    sub: {
      name: "asdf",
      sub: {
        name: "inside_asdf",
        sub: {}
      }
    }
  }];


console.log($.extend({}, data, aaaa));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>