ps:学习自抖音某博主,仅自己学习记录使用
首先让我们看一组树形结构数据
const tree = [ { id: 1, name: 'a', children: [ { id: 12, name: 'aa', children: [ { id: 121, name: 'aaa', }, { id: 122, name: 'aab' } ] } ] }, { id: 2, name: 'b' }, { id: 3, name: 'c', children: [ { id: 31, name: 'cc', children: [ { id: 311, name: 'ccc' } ] } ] } ]
那么如何利用reduce将其转换为一维数组呢?
博主给出的原方案
const result = tree.reduce(function fn (prev, curr) { prev.push({ id: curr.id, name: curr.name }) curr.children && curr.children.forEach((v) => { v.parentId = curr.id arguments.callee(prev, v) }) return prev}, [])
那么什么是arguments.callee()呢
从mdn给出的解释可以看出,该方法可以以递归的形式调用当前函数体内正常执行的函数,但该函数在严格模式下是无法使用的,因此,我们改造下此方法,使用有名函数做递归调用
改造后的方法
const result = tree.reduce(function fn (prev: any, curr: any) { curr.parentId ? prev.push({ id: curr.id, name: curr.name, parentId: curr.parentId // 加入parentId做层级标识 }) : prev.push({ id: curr.id, name: curr.name }) curr.children && curr.children.forEach((item: any) => { item.parentId = curr.id fn(prev, item) }) return prev}, [])