js 트 리 데이터 구조 변환, 메뉴 트 리 데이터 구조 변환, 무한 삽입 가능
var list = [
{
"parent_id" : "a",
"id" : "a_1",
"name" : "a_1"
},{
"id":"a",
"name": "a"
},{
"parent_id" : "a",
"id" : "a_2",
"name" : "a_2"
},{
"parent_id" : "a",
"id" : "a_3",
"name" : "a_3"
},{
"parent_id" : "b",
"id":'b_1',
"name": "b_1"
},{
"parent_id" : "b_1",
"id": "b_1_1",
"name": "b_1_1"
},{
"parent_id" : "b_1_1",
"id": "b_1_1_1",
"name": "b_1_1_1"
},{
"id": "b",
"name": "b"
},{
"parent_id" : "c",
"id": "c_1",
"name": "c_1"
}];
원시 데이터 구 조 는 위 와 같 습 니 다. 배열 의 상하 관 계 는 무질서 합 니 다. 트 리 구조 로 전환 하 는 것 은 다음 과 같은 두 가지 방식 을 사용 할 수 있 습 니 다. 1. 이중 순환 을 사용 하 는 동시에 변수의 인용 관 계 를 이용 하여 각 항목 에 대응 하 는 하위 노드 를 찾 고 인용 관 계 를 추가 할 수 있 습 니 다. 코드 는 다음 과 같 습 니 다.
function fomartToTree(list){
//filter , children ,
// , for
return list.filter(function(parent){
// ,
let branchArr = list.filter(function(child){
return parent.id == child.parent_id;
});
// children
parent.children = branchArr;
return !parent.parent_id; //
});
}
let time=Date.now();
let result= fomartToTree(list);
console.log(' :'+(Date.now()-time)+'ms');
console.log(' :',JSON.stringify(result,null,2));
위의 이런 방법 은 코드 의 양 이 적 고 효율 도 높 아서 문 제 를 완벽 하 게 해결 할 수 있다.관심 이 있 으 면 두 번 째 방법 을 보 셔 도 됩 니 다.
2. 순환 + 재 귀 를 사용 합 니 다. 이것 은 비교적 직접적인 방법 이지 만 사용 할 수 있 습 니 다. 잘못된 노드 를 걸 러 낼 수 있 습 니 다. 코드 는 다음 과 같 습 니 다.
function formatList(data) {
var findParent=function (child,rsArr) {
var isfind=false;
for(var i=0,len=rsArr.length;i
실행 결과:
: [
{
"id": "a",
"name": "a",
"children": [
{
"parent_id": "a",
"id": "a_2",
"name": "a_2",
"children": []
},
{
"parent_id": "a",
"id": "a_3",
"name": "a_3",
"children": []
},
{
"parent_id": "a",
"id": "a_1",
"name": "a_1",
"children": []
}
]
},
{
"id": "b",
"name": "b",
"children": [
{
"parent_id": "b",
"id": "b_1",
"name": "b_1",
"children": [
{
"parent_id": "b_1",
"id": "b_1_1",
"name": "b_1_1",
"children": [
{
"parent_id": "b_1_1",
"id": "b_1_1_1",
"name": "b_1_1_1",
"children": []
}
]
}
]
}
]
}
]
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.