平时开发中会经常碰到树形数据，而我们存储的数据往往是扁平的数据，需要在前端或者后端对数据进行进一步处理成前端组件需要的树形数据。在操作完树形数据后再转换成扁平数据发给后端。下面JavaScript 中处理树形数据的方法，包括构建树和解析树。
一、构建树
假设我们有一个扁平的数组数据，每个元素包含 id、parentId 和 name 等属性，我们可以将其构建为树形结构。以下是一个实现函数：
javascript">function buildTree(arr, parentId = null) {let tree = [];arr.forEach(item => {if (item.parentId === parentId) {let children = buildTree(arr, item.id);if (children.length > 0) {item.children = children;}tree.push(item);}});return tree;
}以下是使用示例：
javascript">let flatData = [{ id: 1, parentId: null, name: 'Root' },{ id: 2, parentId: 1, name: 'Child 1' },{ id: 3, parentId: 1, name: 'Child 2' },{ id: 4, parentId: 3, name: 'Grandchild 1' }
];
let treeData = buildTree(flatData);
console.log(treeData);解释：
buildTree函数接收一个扁平数组arr和一个可选的parentId作为参数，默认为null，用于表示根节点。- 函数使用
forEach遍历数组中的每个元素。 - 如果元素的
parentId等于传入的parentId，则递归调用buildTree函数查找其子节点，并将结果存储在children属性中。 - 最终将满足条件的元素添加到
tree数组中。
二、解析树
假设我们有一个树形结构的数据，我们要将其解析为一个扁平的数组。以下是一个实现函数：
javascript">function flattenTree(tree, parentId = null) {let flatArray = [];tree.forEach(item => {let newItem = {...item };newItem.parentId = parentId;flatArray.push(newItem);if (item.children) {flatArray = flatArray.concat(flattenTree(item.children, item.id));}});return flatArray;
}以下是使用示例：
javascript">let treeData = [{id: 1,name: 'Root',children: [{ id: 2, name: 'Child 1' },{id: 3,name: 'Child 2',children: [{ id: 4, name: 'Grandchild 1' }]}]}
];
let flatData = flattenTree(treeData);
console.log(flatData);解释：
flattenTree函数接收一个树形结构tree和一个可选的parentId作为参数，默认为null。- 函数使用
forEach遍历树中的每个元素。 - 首先将当前元素复制到
newItem中，并设置parentId。 - 将
newItem加入到flatArray中。 - 如果元素有
children，递归调用flattenTree函数将子节点添加到flatArray中，并将当前元素的id作为子节点的parentId。
