Javascript 按值 objects 和 parent 的特殊排序数组

Question

我想转换一个 object 数组，如下所示：

const children = [
  { name: c1, parent: p1, draw_order: 1 },
  { name: c2, parent: p2, draw_order: 2 },
  { name: c3, parent: p2, draw_order: 4 },
  { name: c4, parent: p1, draw_order: 3 },
  { name: c5, parent: p3, draw_order: 1 },
];

1。我想创建一个包含 parent object 的新数组，例如：

const parents = [
  { name:p1, draw_order: 1, children: [...] },
  { name:p2, draw_order: 2, children: [...] },
  { name:p3, draw_order: 1, children: [...] },
]

parent Object 的 draw_order 应等于 children 的 draw_order 值中的最低值。

类似于：

const parents = [];

children.forEach(c => {
  const parent = parents.find(p => p.name === c.name);
  parent ? parents.children.push(c) : parents.push({name: c.parent, children:[c})
})

parents.forEach(p => {
  const drawOrder = Math.min(...p.children.map(c => c.drawOrder));
  p.draw_order = drawOrder;
})

2。 parent 现在重复了 draw_order - 1, 2, 1；我想将其更新为：

1 => 1, 2 => 3, 1 => 2

如果值为：[1, 3, 4, 4, 1, 3, 2]

1 => 1
3 => 4
4 => 6
4 => 7
1 => 2
3 => 5
2 => 3

最终结果应该是：

const parents = [
  { name:p1, draw_order: 1, children: [...] },
  { name:p2, draw_order: 3, children: [...] },
  { name:p3, draw_order: 2, children: [...] },
]

只是为了检查我们是否有：

const children = [
  { name: c1, parent: p1, draw_order: 1 },
  { name: c2, parent: p8, draw_order: 2 },
  { name: c3, parent: p2, draw_order: 4 },
  { name: c4, parent: p1, draw_order: 3 },
  { name: c5, parent: p4, draw_order: 3 },
  { name: c6, parent: p4, draw_order: 9 },
  { name: c7, parent: p3, draw_order: 1 },
];

输出应该是

const parents = [
  { name:p1, draw_order: 1, children: [...] },
  { name:p2, draw_order: 5, children: [...] },
  { name:p3, draw_order: 2, children: [...] },
  { name:p4, draw_order: 4, children: [...] },
  { name:p8, draw_order: 3, children: [...] },
]

谢谢

Answer 1

通过 parent 将 children 缩小为 parents 的地图。如果parent已经存在于Map中，则将child存储在children的数组中，并在需要时替换draw_order。

每当遇到新的 parent 时，将 object 设置为 parent 的 name，基础 draw_order（当前 child's)，以及一个 children 数组，其中包含当前的 child。使用 parent 作为地图的键。

使用 Array.from().

将地图的值转换为数组

const children = [{"name":"c1","parent":"p1","draw_order":1},{"name":"c2","parent":"p2","draw_order":2},{"name":"c3","parent":"p2","draw_order":4},{"name":"c4","parent":"p1","draw_order":3},{"name":"c5","parent":"p3","draw_order":1}];

const result = Array.from(children.reduce((acc, o) => {
  if(acc.has(o.parent)) {
    const parent = acc.get(o.parent);

    parent.children.push(o);

    parent.draw_order = Math.min(o.draw_order, parent.draw_order);
  } else {
    acc.set(o.parent, { 
      name: o.parent, 
      draw_order: o.draw_order,
      children: [o] 
    });
  }

  return acc;
}, new Map()).values());

console.log(result);

Answer 2

您可以通过收集所有值并重新映射新订单来创建新订单。

const
    array = [1, 3, 4, 4, 1, 3, 2],
    result = array
        .reduce((r, v, i) => ((r[v] ??= []).push(i), r), [])
        .flat()
        .reduce((v => (r, i) => (r[i] = v++, r))(1), []);

console.log(...result);

Javascript 按值 objects 和 parent 的特殊排序数组

Javascript special sorting array of objects by value and parent

javascript

arrays

sorting

children

parent