首頁猿問壓平 JavaScript...

壓平 JavaScript 樹，嘗試了一些解決方案

JavaScript

aluckdog 2021-10-29 16:39:09

鑒于這棵樹，是否有一種簡單的方法可以將其轉換為具有以下條件的平面數組？JS ES5，也使用了 jQuery尊重呈現順序添加顯示縮進級別的“級別”屬性，從 0 開始預期的結果應該是這樣的：[ { "root": "0", "id": "1", "name": "Frutta", "status": "1", "position": "1" "level": 0 }, { "root": "1", "id": "4", "name": "Agrumi", "status": "1", "position": "3", "level": 1 }, { "root": "1", "id": "5", "name": "Pere", "status": "1", "position": "4", "level": 1 }, { "root": "0", "id": "2", "name": "Ortaggi", "status": "1", "position": "1", "level": 0 }, { "root": "2", "id": "7", "name": "Da foglia", "status": "1", "position": "6", "level": 1 }, { "root": "7", "id": "9", "name": "Insalate", "status": "1", "position": "1", "level": 2 },...

查看完整描述

1 回答

智慧大石

TA貢獻1946條經驗獲得超3個贊

您可以采用遞歸方法Array#flatMap并存儲下一次調用的級別。

const

flatTree = (level = 0) => ({ children = [], ...object }) => [

{ ...object, level }, ...children.flatMap(flatTree(level + 1))

];

var tree = [{ root: "0", id: "1", name: "Frutta", status: "1", position: "1", children: [{ root: "1", id: "4", name: "Agrumi", status: "1", position: "3", children: [] }, { root: "1", id: "5", name: "Pere", status: "1", position: "4", children: [] }] }, { root: "0", id: "2", name: "Ortaggi", status: "1", position: "1", children: [{ root: "2", id: "7", name: "Da foglia", status: "1", position: "6", children: [{ root: "7", id: "9", name: "Insalate", status: "1", position: "1", children: [] }] }, { root: "2", id: "8", name: "Da fiore", status: "1", position: "7", children: [] }, { root: "2", id: "21", name: "Da frutto", status: "1", position: "16", children: [] }, { root: "2", id: "22", name: "Da radici", status: "1", position: "17", children: [] }, { root: "2", id: "23", name: "Da fusto", status: "1", position: "8", children: [] }, { root: "2", id: "24", name: "Da bulbi", status: "1", position: "18", children: [] }] }, { root: "0", id: "15", name: "Colori", status: "1", position: "14", children: [{ root: "15", id: "3", name: "Banane", status: "1", position: "2", children: [{ root: "3", id: "6", name: "Mele", status: "1", position: "5", children: [] }] }, { root: "15", id: "16", name: "Blu/Viola", status: "1", position: "10", children: [] }, { root: "15", id: "17", name: "Verde", status: "1", position: "11", children: [] }, { root: "15", id: "18", name: "Bianco", status: "1", position: "12", children: [] }, { root: "15", id: "19", name: "Giallo/Arancio", status: "1", position: "13", children: [] }, { root: "15", id: "20", name: "Rosso", status: "1", position: "14", children: [] }] }, { root: "0", id: "25", name: "Persone", status: "1", position: "24", children: [{ root: "25", id: "26", name: "Fabrizio", status: "1", position: "2", children: [{ root: "26", id: "27", name: "Uomo", status: "1", position: "21", children: [] }] }, { root: "25", id: "28", name: "Ivan", status: "1", position: "1", children: [] }] }, { root: "0", id: "29", name: "Category", status: "1", position: "25", children: [] }],

flat = tree.flatMap(flatTree());

console.log(flat);

.as-console-wrapper { max-height: 100% !important; top: 0; }

ES5 與Array#reduce.

function flatTree(level) {

return function(result, object) {

var children = object.children || [],

item = Object.keys(object).reduce(function (o, k) {

if (k !== 'children') o[k] = object[k];

return o;

}, {});

level = level || 0;

item.level = level;

return result.concat(item, children.reduce(flatTree(level + 1), []));

};

}

flat = tree.reduce(flatTree(), []);

console.log(flat);

.as-console-wrapper { max-height: 100% !important; top: 0; }

反對回復 2021-10-29

1 回答
0 關注
195 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

壓平 JavaScript 樹，嘗試了一些解決方案

壓平 JavaScript 樹，嘗試了一些解決方案

1 回答

添加回答

壓平 JavaScript 樹，嘗試了一些解決方案