JavaScript-Format Array von Objekten in verschachtelte Kinder

Question

Ich habe ein Array von Objekten mit ParentId und Sortierwerte, die ich in ein Array mit verschachtelten "Kinder" und sortiert werden möchte.

Zum Beispiel ist hier die Daten:

[{ 
    id: 1, 
    sort: 2, 
    parentId: null, 
    name: 'A' 
}, { 
    id: 2, 
    sort: 1, 
    parentId: 1, 
    name: 'A.1' 
}, { 
    id: 3 
    sort: 2, 
    parentId: 1, 
    name: 'A.2' 
}, { 
    id: 4, 
    sort: 1, 
    parentId: null, 
    name: 'B' 
}] 

Die Art und Weise Ich mag würde dies wäre zu transformieren, wie:

[{ 
    id: 4, 
    sort: 1, 
    parentId: null, 
    name: 'B', 
    children: [] 
}, { 
    id: 1, 
    sort: 2, 
    parentId: null, 
    name: 'A', 
    children: [{ 
     id: 2, 
     sort: 1, 
     parentId: 1, 
     name: 'A.1' 
    }, { 
     id: 3 
     sort: 2, 
     parentId: 1, 
     name: 'A.2' 
    }] 
}] 

Diese sortiert ist (id 4 an der Spitze zu sein, seit sortierung ist 1) und die kinder sind verschachtelt und auch entsprechend sortiert.

Irgendwelche Vorschläge für eine gute Möglichkeit, dies zu tun? Ich kann rekursiv durchlaufen, um Kinder anzuwenden, aber nicht sicher, wie ich das sortieren kann.

Answer 1

Dies ist ein Vorschlag, der erste und der Filter danach sortiert.

Die Sortierung übernimmt die Eigenschaften parentId und sort. Dies ist für den nächsten Schritt notwendig, da das "Filtern" ein sortiertes Array benötigt.

Später wird das Array mit Array#filter() gefiltert, hier wird thisArgs für Referenzierungsknoten für eine mögliche Einfügung von Kindern verwendet.

Bearbeiten: Update für unsortierte (id/parentId) Daten.

var array = [{ id: 1, sort: 2, parentId: null, name: 'A' }, { id: 2, sort: 1, parentId: 1, name: 'A.1' }, { id: 3, sort: 2, parentId: 1, name: 'A.2' }, { id: 4, sort: 1, parentId: null, name: 'B' }], 
 
    nested; 
 

 
array.sort(function (a, b) { 
 
    return (a.parentId || -1) - (b.parentId || -1) || a.sort - b.sort; 
 
}); 
 

 
nested = array.filter(function (a) { 
 
    a.children = this[a.id] && this[a.id].children; 
 
    this[a.id] = a; 
 
    if (a.parentId === null) { 
 
     return true; 
 
    } 
 
    this[a.parentId] = this[a.parentId] || {}; 
 
    this[a.parentId].children = this[a.parentId].children || []; 
 
    this[a.parentId].children.push(a); 
 
}, Object.create(null)); 
 

 
document.write('<pre>' + JSON.stringify(nested, 0, 4) + '</pre>');

Answer 2

1. würde ich eine neue Datenstruktur, erstellen, um wie folgt aussehen:

   {1: { id: 1, Art: 2, parentId: null, Name: 'A' }, 2: { ID: 4, sort: 1, parentId: null, Name: 'B' } }

Dinge zu bemerken: Die neue Struktur ist ein Objekt, kein Array, das nur die obersten Elemente darin (die mit parentIdnull)

enthält

2. dann Führen Sie den Original-Array ein for über und new_obj[ orig_arr_curr_elem[parentId] ].children.push(orig_arr_curr_elem)

3. Dann ein neues Array mit der elems erstellen zuweisen aus new_objsort() den (oder der children Eigenschaft), aber Sie wollen

Code, der die Schritte 1 und 2 (unter Verwendung von diesen ausführen Knoten) implementiert:

var util = require('util'); 
var old_arr = [{ 
    id: 1, 
    sort: 2, 
    parentId: null, 
    name: 'A' 
}, { 
    id: 2, 
    sort: 1, 
    parentId: 1, 
    name: 'A.1' 
}, { 
    id: 3, 
    sort: 2, 
    parentId: 1, 
    name: 'A.2' 
}, { 
    id: 4, 
    sort: 1, 
    parentId: null, 
    name: 'B' 
}]; 

var new_obj = {}; 
for (var i = 0; i < old_arr.length; i++){ 
    if (old_arr[i].parentId == null) 
     new_obj[ old_arr[i].id ] = old_arr[i]; 
} 

for (var i = 0; i < old_arr.length; i++){ 
    if (old_arr[i].parentId == null) continue; 
    new_obj[ old_arr[i].parentId ].children = new_obj[ old_arr[i].parentId ].children || []; 
    new_obj[ old_arr[i].parentId ].children.push(old_arr[i]); 
} 

console.log(util.inspect(new_obj, {showHidden: false, depth: null})); 

Answer 3

gab es mir einen Versuch und kam zurück, und es gibt bereits andere Antworten, aber ich bin es trotzdem zu veröffentlichen.

Diese Methode modifiziert das ursprüngliche Array:

var items = [{id: 1,sort: 2,parentId: null,name: 'A'}, {id: 2,sort: 1,parentId: 1,name: 'A.1'}, {id: 3,sort: 2,parentId: 1,name: 'A.2'}, {id: 4,sort: 1,parentId: null,name: 'B'}]; 
 

 

 
function generate_tree(arr){ 
 
    var references = {}; 
 
    arr.sort(function(a,b){ 
 
    // Save references to each item by id while sorting 
 
    references[a.id] = a; references[b.id] = b; 
 
    // Add a children property 
 
    a.children = []; b.children = []; 
 
    if(a.sort > b.sort) return 1; 
 
    if(a.sort < b.sort) return -1; 
 
    return 0; 
 
    }); 
 

 
    for(var i=0; i<arr.length; i++){ 
 
    var item = arr[i]; 
 
    if(item.parentId !== null && references.hasOwnProperty(item.parentId)){ 
 
     references[item.parentId].children.push(arr.splice(i,1)[0]); 
 
     i--; // Because the current index now contains the next item 
 
    } 
 
    } 
 
    return arr; 
 
} 
 

 
document.body.innerHTML = "<pre>" + JSON.stringify(generate_tree(items), null, 4) + "</pre>";