Дописать функцию для создания дерева ответов?

Question

[Александр]

Разрабатываю фронтенд для самописного форума. Нужно написать функцию, которая будет создавать дерево ответов в постах. Затем это дерево будет рекурсивно рендерить React(это уже сделано).
Типичный пост выглядит так(убрал элементы, не относящиеся к задаче):

{
    id: 2,
    refTo: 1
    comment: 'Комментарий'
}

id - id поста, refTo - id поста, на который отвечает этот пост.

Написал следующую функцию:

const createReplyTree = (replyNode, thread = replyNode) => {
        const tree = replyNode.map(i => {
            const replies = thread.filter(item => item.refTo === i.id);
            return {...i, replies: createReplyTree(replies, thread)};
        });
        return tree;
    };

Частично реализовывает задачу - к постам, на которые кто-то ответил, эти посты рекурсивно добавляет в replies. Но в конце массива остаются дубликаты ответов. Их нужно как-то исключить из массива.
Решение желательно на ES6 и без сторонних библиотек.

У постов может и не быть refTo.

Comments

[0xD34F]

было

[Александр]

0xD34F, спасибо, работает.

Answer 1

[Дмитрий]

Перебор массива с фильтрацией будет работать быстро только при небольшом количестве элементов или при использовании memo или reselect, для гарантии быстроты лучше перевести массив в дерево. Что-то вроде такого.

const toTree = (arr, idAttr = 'id', parentAttr = 'parentId') => {
  arr.sort((a, b) => 
    (a[parentAttr] === b[idAttr] && 1) ||
    (b[parentAttr] === a[idAttr] && -1) ||
    0)

  const tree = arr.reduce((tree, data) => {
    data.children = []
    tree[data[idAttr]] = data;
    (tree[data[parentId]] || tree).children.push(data);
    return tree
  }, { children: [] }).children;

  return tree
}

Получится дерево в виде

[{
    id: 1,
    comment: 'Комментарий',
    children: [{
        id: 2,
        refTo: 1.
        children: ...  
    }, {
        id: 3.
        refTo: 1,
    }]
}, {...}]