JSON 개체의 평면 배열을 JavaScript의 계층적 트리 구조로 효율적으로 변환하는 방법은 무엇입니까?

JavaScript에서 평면 배열을 계층적 트리 구조로 변환

JavaScript에서는 데이터를 계층적으로 구성해야 하는 상황에 자주 직면합니다. 일반적인 표현 중 하나는 노드가 부모-자식 관계로 상호 연결된 트리 구조입니다. 이 기사에서는 JSON 개체의 평면 배열을 계층적 트리 구조로 변환하는 효율적인 기술을 살펴봅니다.

문제 설명

각각 트리의 노드를 나타내는 JSON 개체 배열이 주어지면, "id", "parentId", "level" 및 "text"와 같은 속성을 사용하여 이 평면 배열을 각 노드가 해당 배열을 포함하는 중첩된 JSON 개체로 변환하는 것을 목표로 합니다.

해결책

효과적인 접근 방식 중 하나는 지도 조회 알고리즘을 활용하는 것입니다. 각 노드의 "id"를 배열의 해당 인덱스와 연결하는 맵을 생성함으로써 배열을 효율적으로 탐색하고 계층 구조를 구축할 수 있습니다.

먼저 맵을 초기화하고 각 노드에 하위 항목을 저장하기 위한 빈 "자식" 배열입니다. 그런 다음 배열을 반복하고 각 노드에 대해 "parentId"를 확인합니다. "0"이 아닌 경우 맵의 "id"를 사용하여 상위 노드를 찾고 현재 노드를 하위 노드로 추가합니다. "parentId"가 "0"인 노드는 트리의 루트를 나타냅니다.

이 솔루션의 주요 장점은 효율성과 여러 루트를 처리할 수 있는 능력입니다. 외부 라이브러리에 의존하지 않으며 매달린 분기(상위 노드가 없는 하위 노드)를 처리할 수 있습니다.

다음은 이 솔루션을 구현하는 JavaScript 코드 조각입니다.

function list_to_tree(list) {
  var map = {}, node, roots = [], i;
  
  for (i = 0; i <p>제공된 샘플 입력 사용 , 함수는 아래 예와 같이 예상되는 계층적 출력을 생성합니다.</p><pre class="brush:php;toolbar:false">var entries = [{
        "id": "12",
        "parentId": "0",
        "text": "Man",
        "level": "1",
        "children": null
      },
      {
        "id": "6",
        "parentId": "12",
        "text": "Boy",
        "level": "2",
        "children": null
      },
      {
        "id": "7",
        "parentId": "12",
        "text": "Other",
        "level": "2",
        "children": null
      },
      {
        "id": "9",
        "parentId": "0",
        "text": "Woman",
        "level": "1",
        "children": null
      },
      {
        "id": "11",
        "parentId": "9",
        "text": "Girl",
        "level": "2",
        "children": null
      }
    ];

console.log(list_to_tree(entries));

이 접근 방식은 다음을 제공합니다. 데이터 관리 및 시각화 요구 사항을 충족하면서 평면 배열에서 계층적 트리 구조를 구축하는 간단하고 효율적인 솔루션입니다.

위 내용은 JSON 개체의 평면 배열을 JavaScript의 계층적 트리 구조로 효율적으로 변환하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!