javascript - 通过另一个深度嵌套的对象数组对深度嵌套的对象数组进行排序的最高效方法

Question

举个例子——我包含了一个元素array，它包含一个object，它有一个Children键，它是一个< strong>array of objects 并且每个 object 也有它自己的包含另一个数组的 Children 键。

[
  {
    "Id": "1",
    "Children": [
      {
        "Id": "2",
        "Children": [
          {
            "Id": "10",
            "DisplayName": "3-4",
          },
          {
            "Id": "1000",
            "DisplayName": "5-6",
          },
          {
            "Id": "100",
            "DisplayName": "1-2",
          },
        ]
      }
    ]
  }
]

有一个第二个对象数组，我想与第一个对象数组比较，目的是确保第一个数组与对象的第二个数组的顺序相同，如果不是，则排序直到它是。

这是第二个数组:

[
  {
    "Id": "1",
    "Children": [
      {
        "Id": "2",
        "Children": [
           {
            "Id": "100",
            "DisplayName": "1-2",
          },
          {
            "Id": "10",
            "DisplayName": "3-4",
          },
          {
            "Id": "1000",
            "DisplayName": "5-6",
          },
        ]
      }
    ]
  }
]

这将运行的数据可能高达数万 - 因此性能至关重要。

我目前正在尝试的是使用实用方法将第二个数组的每个元素转换为对象的键控对象，例如

{
   1:  {
        "Id": "1",
        "Children": [
          {
            "Id": "2",
            "Children": [
              {
                "Id": "4",
                "DisplayName": "3-4",
              },
              {
                "Id": "3",
                "DisplayName": "1-2",
              },
            ]
          }
        ]
      }
}

这允许从顶层快速查找。我想知道我是否应该一直这样做下去，或者是否有一种惯用的方法来完成它。我也考虑过递归。已排序数组的顺序不基于 Id - 它是任意的。因此无论如何都需要保留顺序。

Answer 1

假设相同的深度和所有 Id 都存在于每个对象的每个级别中，使用匹配使用 Array#findIndex() 的递归函数在排序回调中

function sortChildren(main, other) {
  other.forEach((o, i) => {
    if (o.children) {
      const mChilds = main[i].children, oChilds = o.children;
      
      oChilds.sort((a, b) => {
        return mChilds.findIndex(main => main.Id === a.Id) - mChilds.findIndex(main => main.Id === b.Id)
      });
      // call function again on this level passing appropriate children arrays in
      sortChildren(mChilds, oChilds)
    }
  })
}

sortChildren(data, newData);
console.log(JSON.stringify(newData, null, ' '))

<script>
  var data = [{
    "Id": "1",
    "Children": [{
      "Id": "2",
      "Children": [{
          "Id": "3",
          "DisplayName": "1-2",
        },
        {
          "Id": "4",
          "DisplayName": "3-4",
        },
      ]
    }]
  }]

  var newData = [{
    "Id": "1",
    "Children": [{
      "Id": "2",
      "Children": [{
          "Id": "4",
          "DisplayName": "3-4",
        },
        {
          "Id": "3",
          "DisplayName": "1-2",
        },
      ]
    }]
  }]

</script>