reduce 樹結構數組轉爲扁平數組

每個元素全字段

const flatten = (data)=> data.reduce((arr, item)=> arr.concat([item], flatten(item.childrenList)), []);
const list = [
  {id: 1, name: 1, pid: -1, childrenList: [
    {id: 7, name: 7, pid: 1, childrenList: []},
    {id: 8, name: 8, pid: 1, childrenList: []},
    {id: 9, name: 9, pid: 1, childrenList: []},
  ]},
  {id: 2, name: 2, pid: -1, childrenList: [
    {id: 3, name: 3, pid: 2, childrenList: []},
    {id: 4, name: 4, pid: 2, childrenList: []},
    {id: 5, name: 5, pid: 2, childrenList: []},
    {id: 6, name: 6, pid: 2, childrenList: []},
  ]},
];
flatten(list);
// 下面爲輸出結果
[
	{"id":1,"name":1,"pid":-1,"childrenList":[
		{"id":7,"name":7,"pid":1,"childrenList":[]},
		{"id":8,"name":8,"pid":1,"childrenList":[]},
		{"id":9,"name":9,"pid":1,"childrenList":[]}
	]},
	{"id":7,"name":7,"pid":1,"childrenList":[]},
	{"id":8,"name":8,"pid":1,"childrenList":[]},
	{"id":9,"name":9,"pid":1,"childrenList":[]},
	{"id":2,"name":2,"pid":-1,"childrenList":[
		{"id":3,"name":3,"pid":2,"childrenList":[]},
		{"id":4,"name":4,"pid":2,"childrenList":[]},
		{"id":5,"name":5,"pid":2,"childrenList":[]},
		{"id":6,"name":6,"pid":2,"childrenList":[]}
	]},
	{"id":3,"name":3,"pid":2,"childrenList":[]},
	{"id":4,"name":4,"pid":2,"childrenList":[]},
	{"id":5,"name":5,"pid":2,"childrenList":[]},
	{"id":6,"name":6,"pid":2,"childrenList":[]}
]

每個元素部分字段

const flatten = (data)=> data.reduce((arr, {id, name, pid, childrenList = []})=> arr.concat([{id, name, pid}], flatten(childrenList)), []);
const list = [
  {id: 1, name: 1, pid: -1, childrenList: [
    {id: 7, name: 7, pid: 1, childrenList: []},
    {id: 8, name: 8, pid: 1, childrenList: []},
    {id: 9, name: 9, pid: 1, childrenList: []},
  ]},
  {id: 2, name: 2, pid: -1, childrenList: [
    {id: 3, name: 3, pid: 2, childrenList: []},
    {id: 4, name: 4, pid: 2, childrenList: []},
    {id: 5, name: 5, pid: 2, childrenList: []},
    {id: 6, name: 6, pid: 2, childrenList: []},
  ]},
];
flatten(list);
// 下面爲輸出結果
[
	{"id":1,"name":1,"pid":-1},
	{"id":7,"name":7,"pid":1},
	{"id":8,"name":8,"pid":1},
	{"id":9,"name":9,"pid":1},
	{"id":2,"name":2,"pid":-1},
	{"id":3,"name":3,"pid":2},
	{"id":4,"name":4,"pid":2},
	{"id":5,"name":5,"pid":2},
	{"id":6,"name":6,"pid":2}
]
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章