本文介绍了在JavaScript中将一维数组转换为多维树形结构的实现方法。通过利用对象映射表（idMap）记录节点，并遍历数组根据parentId关联父子关系，最终构建出包含children字段的完整树结构。文章提供了核心代码逻辑、测试数据示例及调用方式，帮助开发者快速掌握该技巧。
介绍将一维数组转换为树结构数组的具体方法。
实现方案
/**
* 将一维数组转换为树结构
* @param {Array} data - 输入的一维数组
* @return {Array} 树结构数组
*/
function arrayToTree(data) {
// 创建一个id映射，用来快速查找元素
const idMap = {};
// 遍历数组，初始化每个元素的children字段，并将其存入idMap
data.forEach(item => {
idMap[item.id] = { ...item, children: [] };
});
// 初始化一个数组，用来存储根节点
const tree = [];
// 再次遍历数组，根据parentId建立树结构
data.forEach(item => {
const { id, parentId } = item;
if (parentId == '' || parentId == null || parentId == undefined) {
// 如果parentId为null或undefined，表示是根节点
tree.push(idMap[id]);
} else {
// 否则，将当前元素添加到其父元素的children字段中
if (idMap[parentId]) {
idMap[parentId].children.push(idMap[id]);
}
}
});
return tree;
}
使用注意事项
- 确定根元素
parentId的判定条件 - 元素的唯一标识字段为
id，父级关联字段为parentId
示例数组结构data
let data = [
{ id: '1', parentId: '' },
{ id: '1_1', parentId: '1' },
{ id: '2', parentId: '' }
];
函数调用方式
let tree = arrayToTree(data);
输出结果展示
[ { "id": "1", "parentId": "", "children": [ { "id": "1_1", "parentId": "1", "children": [] } ] }, { "id": "2", "parentId": "", "children": [] } ]
至此，关于JS一维数组转多维数组树的方法介绍完毕。如需了解更多相关JS一维转多维数组的内容，建议查阅本站过往文章或继续阅读后续内容，感谢大家的支持！