Javascript : 파싱 및 플랫 json 구조를 중첩 배열로 정렬 하시겠습니까?

Question

는 I은 (간단한 예)와 같은 플랫 JSON 입력 함께 시작하고 :

[ 
{id:1, value:'child1', parentId:2, sortOrder:1}, 
{id:2, value:'root1', parentId:null, sortOrder:1}, 
{id:3, value:'root2', parentId:null, sortOrder:2}, 
{id:4, value:'child2', parentId:1, sortOrder:2}, 
{id:5, value:'root3', parentId:null, sortOrder:3}, 
{id:6, value:'child1', parentId:2, sortOrder:1}, 
{id:7, value:'root4', parentId:null, sortOrder:4} 
]; 

입력은 임의의 깊이 및 길이, 그리고 상위에 기초하여 중첩 배열의 집합체로 포맷 할 필요가있다 - 중개 관계뿐만 아니라 각 중첩 수준에서 오름차순으로 정렬됩니다.

네이티브 JS 또는 UnderscoreJS를 사용하여 출력의 서식을 지정할 수 있습니다.

출력

기본적인 형태와 JSON 구조로 포맷된다 :

각 요소는 객체 인 JSON

root1 
    child1 
    child2 
root2 
    child1 
    child1 
    child2 
    child2 

    etc... 

.

위의 플랫 구조를 가진 db 테이블에서 데이터가 발생할 가능성이 가장 높기 때문에 중첩 깊이는 아무 것도 될 수 있습니다.

의견이 있으십니까?

Answer 1

다음과 같이이 작업을 수행합니다. 중첩 된 객체를 첨부하기 위해 value 속성을 사용할 수 있었지만 그 시점에서 질문이 불분명했습니다. 대신 중첩 된 구조를 만들려면 children 속성을 만들었습니다. 당신은 아이들이 당신이 그들을받을 부모의 children 배열 속성 방식으로 개체를 배치 할 경우

var flat = [ 
 
{id:1, value:'child1', parentId:2, sortOrder:1}, 
 
{id:2, value:'root1', parentId:null, sortOrder:1}, 
 
{id:3, value:'root2', parentId:null, sortOrder:2}, 
 
{id:4, value:'child2', parentId:1, sortOrder:2}, 
 
{id:5, value:'root3', parentId:null, sortOrder:3}, 
 
{id:6, value:'child1', parentId:2, sortOrder:1}, 
 
{id:7, value:'root4', parentId:null, sortOrder:4} 
 
], 
 
    lut = flat.sort((a,b) => a.sortOrder - b.sortOrder) 
 
       .reduce((t,o) => { o.children === void 0 && (o.children = []); 
 
            t[o.id] = t[o.id] === void 0 ? o : (o.children = t[o.id].children,o); 
 
            o.parentId  !== null && 
 
            (t[o.parentId] !== void 0 ? t[o.parentId].children.push(o) 
 
                  : t[o.parentId] = {id: o.parentId, children: [o]}); 
 
            return t; 
 
           },{}), 
 
    nested = Object.keys(lut).reduce((a,k) => lut[k].parentId === null ? a.concat(lut[k]): a,[]); 
 
console.log(nested);

는 또한 sort 단계는 필요하지 않을 것입니다.

Answer 2

부모 배열 아래의 자식을 새 배열 값 children 속성으로 이동 한 다음 필터링하여 계획을 세웁니다.

const flat = [ 
 
{id:1, value:'child1', parentId:2, sortOrder:1}, 
 
{id:2, value:'root1', parentId:null, sortOrder:1}, 
 
{id:3, value:'root2', parentId:null, sortOrder:2}, 
 
{id:4, value:'child2', parentId:1, sortOrder:2}, 
 
{id:5, value:'root3', parentId:null, sortOrder:3}, 
 
{id:6, value:'child1', parentId:2, sortOrder:1}, 
 
{id:7, value:'root4', parentId:null, sortOrder:4} 
 
]; 
 

 
const nested = flat.filter((elt, idx, arr) => { 
 
    const parent = arr.find(e => e.id === elt.parentId); 
 
    if (!parent) return true; 
 
    (parent.children = parent.children || []).push(elt); 
 
}); 
 

 
console.log(nested);

정렬

는 연습으로 남아있을 것입니다.