Find a js algorithm to convert the data format
var dataList = [
{parent: "",child: "",id: 01},
{parent: "",child: "",id: 02},
{parent: "",child: "",id: 03},
{parent: "",child: "",id: 04},
{parent: "",child: "",id: 05}
]
var getData = [
{
parent: "",
children:[
{ name: "",id: 01 },
{ name: "",id: 02 },
{ name: "",id: 03 },
]
},
{
parent: "",
children:[
{ name: "",id: 04 },
{ name: "",id: 05 }
]
}
]
such as the above code, how to convert dataList to getData easily and quickly?
Why do I think it is very complicated? it is difficult to turn around. Is it because the foundation of js is not solid? How to improve this kind of data conversion ability? Please give me some advice!
if there is only one layer, there are actually only two steps logically
1. Extract the unrepeated parent array
2. Match the children of the parent array
There are many ways to implement
. I'll provide a simple
.
var dataList = [
{parent: "", child: "", id: 01},
{parent: "", child: "", id: 02},
{parent: "", child: "", id: 03},
{parent: "", child: "", id: 04},
{parent: "", child: "", id: 05}
]
var getData = dataList
.reduce((arr, {parent}) => void (!arr.includes(parent) && arr.push(parent)) || arr, [])
.map(parent => ({
parent,
children: dataList.filter(v => v.parent === parent)
}
))
console.log(getData)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script src="transTreeList.js"></script>
<script>
var aData = [
{
id: 1,
text: '',
tel: '18875011111',
pid: 1
},
{
id: 2,
text: '',
tel: '18875011111',
pid: 2
},
{
id: 3,
text: '',
tel: '18875011111',
pid: 3
},
{
id: 4,
text: '',
tel: '18875011111',
pid: 4
},
{
id: 5,
text: '',
tel: '18875011111'
},
{
id: 6,
text: '',
pid: 3
},
{
id: 7,
text: '',
pid: 3
},
{
id: 8,
text: '',
pid: 4
},
{
id: 9,
text: '',
pid: 4
},
{
id: 10,
text: '',
pid: 4
},
{
id: 11,
text: '',
pid: 5
},
{
id: 12,
text: '',
pid: 5
}
]
var arr = transTreeList({
data: aData,
id: 'id',
text: 'text',
pid: 'pid'
});
console.log(arr);
</script>
</body>
</html>
//
function transTreeList (o) {
/*
*
o.data ->
o.id ->
o.text ->
o.pid -> id
o.tId -> id id
o.tText -> text text
o.tPid -> pid pid
o.tChild -> children
*/
if ( !o.data || !o.id || !o.text || !o.pid ) {
return false;
}
if ( !o.tId ) {
o.tId = 'id';
}
if ( !o.tText ) {
o.tText = 'text';
}
if ( !o.tPid ) {
o.tPid = 'pid';
}
if ( !o.tChild ) {
o.tChild = 'children';
}
try {
var data = JSON.parse(JSON.stringify(o.data));
} catch (error) {
return;
}
var aNoChild = [], aData = [], aTid = [];
//
// tid
for ( var i = 0; i < data.length; iPP ) {
var obj = data[i];
if ( o.tId != o.id ) {
obj[o.tId] = obj[o.id];
}
if ( o.tText != o.text ) {
obj[o.tText] = obj[o.text];
}
if ( o.tPid != o.pid ) {
obj[o.tPid] = obj[o.pid];
}
aNoChild.push(obj);
aTid.push(obj[o.tId]);
}
// noLevel
var aChild = [];
for ( var i = 0; i < aNoChild.length; iPP ) {
if ( aTid.indexOf(aNoChild[i][o.tPid]) == -1 || aNoChild[i][o.tPid] == aNoChild[i][o.tId] ) {
aData.push(aNoChild[i]);
} else {
aChild.push(aNoChild[i]);
}
}
for ( var i = 0; i < aChild.length; iPP ) {
for ( var j = 0; j < aNoChild.length; jPP ) {
if ( aNoChild[j][o.tId] == aChild[i][o.tPid] ) {
if ( !(o.tChild in aNoChild[j]) ) {
aNoChild[j][o.tChild] = [];
}
aNoChild[j][o.tChild].push(aChild[i]);
}
}
}
return {
aNoChild: aNoChild,
aData: aData
}
}
look for trees and graphs. Algorithm 4 is good.
