在JavaScript中按属性对整个嵌套对象进行排序

Question

我想循环遍历一个深度嵌套的对象，并根据属性对每个级别进行排序。在本例中，它的id

这是我的对象(将会有更多的级别，我只是为了可读性在这里添加了3个级别)：

const myObj = [
  {
    id: 15,
    children: [
      {
        id: 9,
        children: [
          {
            id: 4,
            children: []
          },
          {
            id: 1,
            children: []
          }
        ]
      },
      {
        id: 4,
        children: [
          {
            id: 35,
            children: [
              {
                id: 12,
                children: []
              },
              {
                id: 8,
                children: []
              }
            ]
          },
          {
            id: 30,
            children: [],
          }
        ]
      },
    ]
  },
  {
    id: 2,
    children: [
      {
        id: 9,
        children: []
      },
      {
        id: 3,
        children: []
      },
    ]
  }
]

以下是所需的输出：

const myObj = [
  {
    id: 2,
    children: [
      {
        id: 3,
        children: []
      },
      {
        id: 9,
        children: []
      }
    ]
  },
  {
    id: 15,
    children: [
      {
        id: 4,
        children: [
          {
            id: 30,
            children: [],
          },
          {
            id: 35,
            children: [
              {
                id: 8,
                children: []
              },
              {
                id: 12,
                children: []
              }
            ]
          },
        ]
      },
      {
        id: 9,
        children: [
          {
            id: 1,
            children: []
          },
          {
            id: 4,
            children: []
          }
        ]
      },
    ]
  }
]

下面是我对它进行排序的尝试：

​

const myObj = [{id:15,children:[{id:9,children:[{id:4,children:[]},{id:1,children:[]}]},{id:4,children:[{id:35,children:[{id:12,children:[]},{id:8,children:[]}]},{id:30,children:[],}]},]},{id:2,children:[{id:9,children:[]},{id:3,children:[]},]}]

function sortByOrderIndex(obj) {
  obj.sort((a, b) => (a.orderindex > b.orderindex) ? 1 : ((b.orderindex > a.orderindex) ? -1 : 0));

  return obj;
}

function sortNestedObj(obj) {
  sortByOrderIndex(obj);

  for (let i = 0; i < obj.length; i++) {
    const t = obj[i];

    if (t.children.length !== 0) {
      sortNestedObj(t.children);
    } else {
      return;
    }
  }
}

console.log(sortByOrderIndex(myObj))

​

我已经创建了一个对对象进行排序的函数，然后尝试创建另一个对象，该对象循环遍历每个有子对象的对象，并使用第一个函数对这些子对象进行排序。如果这些孩子有孩子，那么对它们进行排序，以此类推，直到孩子没有孩子。

Answer 1

您可以递归地sort数组和它的对象的children，如下所示：

​

const myObj = [{id:15,children:[{id:9,children:[{id:4,children:[]},{id:1,children:[]}]},{id:4,children:[{id:35,children:[{id:12,children:[]},{id:8,children:[]}]},{id:30,children:[],}]},]},{id:2,children:[{id:9,children:[]},{id:3,children:[]},]}]

function sortArray(array) {
  array.sort((a, b) => a.id - b.id);
  array.forEach(a => {
    if (a.children && a.children.length > 0)
      sortArray(a.children)
  })
  return array;
}

console.log(sortArray(myObj))

​

Answer 2

您可以创建一个递归排序函数：

​

const myObj = [{id:15,children:[{id:9,children:[{id:4,children:[]},{id:1,children:[]}]},{id:4,children:[{id:35,children:[{id:12,children:[]},{id:8,children:[]}]},{id:30,children:[],}]},]},{id:2,children:[{id:9,children:[]},{id:3,children:[]},]}]

const orderChildren = obj => {
  obj.children.sort((a, b) => a.id - b.id);
  if (obj.children.some(o => o.children.length)) {
    obj.children.forEach(child => orderChildren(child));
  }
  return obj;
};

const myNewObj = myObj.map(o => orderChildren(o)).sort((a, b) => a.id - b.id);

console.log(myNewObj);

.as-console-wrapper { max-height: 100% !important; top: 0; }

​

Answer 3

您可以执行以下操作：

​

const myObj = [{id: 15,children: [{id: 9,children: [{id: 4,children: []},{id: 1,children: []}]},{id: 4,children: [{id: 35,children: [{id: 12,children: []},{id: 8,children: []}]},{id: 30,children: [],}]},]},{id: 2,children: [{id: 9,children: []},{id: 3,children: []},]}];
const deepSortById = arr => (arr.forEach(a => a.children && deepSortById(a.children)), arr.sort((a, b) => a.id - b.id));

const result = deepSortById(myObj);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

​