如何使用ramda将平面列表转换为分层列表？

Question

Like in question. I would like to turn the following list into hierarchical list with children fields. 'parentId' can stay. I just removed it for clarity. The goal is to use ramda with its immutable behavior.

const x = [
  {
    id: 1,
    parentId: null,
    name: 'Top 1'
  },
  {
    id: 2,
    parentId: 1,
    name: 'Middle'
  },
  {
    id: 3,
    parentId: 2,
    name: 'Leaf'
  },
  {
    id: 4,
    parentId: null,
    name: 'Top 2'
  },
];

into this one:

const result = [
    {
        id: 1,
        name: 'Top 1',
        children: [
            {
                id: 2,
                name: 'Middle',
                children: [
                    {
                        id: 3,
                        name: 'Leaf',
                        children: []
                    }
                ]
            }
        ]
    },
    {
        id: 4,
        name: 'Top 2',
        children: []
    }
];

Answer 1

As I answered in Gitter , this seems to do it:

const makeTree = items => {
  const hierarchy = reduce(
    (index, item) => item.parentId in index 
      ? assoc(item.id, [], assoc(item.parentId, append(item.id, index[item.parentId]), index))
      : assoc(item.id, [], index)
    , {}, 
    items
  ) //=> E.g. {"1":[2],"2":[3],"3":[],"4":[]} 
  const index = map(head, groupBy(prop('id'), items)) //=> E.g. {"!": <item1>, "2": <item2>, ...}
  const makeNode = id => dissoc('parentId', assoc('children',  map(makeNode, hierarchy[id]), index[id]))

  return map(makeNode, pluck('id', filter(item => item.parentId == null, items)))
}

It does involve several passes through the data, and the use of groupBy here seems a bit hacky, but I think it's reasonable.

Also those nested assoc s aren't pretty. I might refactor into compose / pipe .

You can see this in action on the Ramda REPL .

Answer 2

In a pure Ramda / point-free / functional style, I would do the following:

const overChildren = over(lensProp('children'))
const findChildren = completeList => parent => filter(child => child.parentId === parent.id, completeList)

const assocChildren = completeList => map(pipe(
  parent => assoc('children', findChildren(completeList)(parent), parent),
  parent => overChildren(assocChildren(completeList), parent)
))

const removeParentIds = map(pipe(
  dissoc('parentId'),
  overChildren(x => removeParentIds(x))
))

const isTop = compose(isNil, prop('parentId'))
const keepOnlyTop = filter(isTop)

const hierarchize = completeList => pipe(
  assocChildren(completeList),
  keepOnlyTop,
  removeParentIds
)(completeList)

hierarchize(list)

Try it here

Note: I've focused on the readability and maintainability, not on performance.