JavaScript树形结构数据与扁平数据结构相互转换

111 阅读1分钟
const data = [
  {label: "1", id: 500, parentId: null},
  {label: "1-1", id: 501, parentId: 500},
  {label: "1-1-1", id: 502, parentId: 501},
  {label: "1-2", id: 503, parentId: 500},
  {label: "1-2-1", id: 504, parentId: 503},
  {label: "1-2-2", id: 505, parentId: 503}
]
// Array -> TreeData
function convertToTreeData(list) {
  const tree = []
  const record = {}
  for(let i = 0, len = list.length; i < len; i++) {
    const item = list[i]
    const {id, parentId} = item
    if(!id) {
      continue;
    }
    if(!!id) {
      if(!record[id]) {
        item.children = record[id] = []
      }else {
        item.children = record[id]
      }
    }
    if(!!parentId) {
      if(!record[parentId]) {
        record[parentId] = []
      }
      record[parentId].push(item)
    }else {
      tree.push(item)
    }
  }
  return tree
}
const tree = convertToTreeData(data)

// TreeData -> Array
function convertToArrayData(tree) {
    return tree.reduce((result, item) => {
      const { children, ...val } = item
      return result.concat(val, children && children.length ? convertToArrayData(children) : [])
    }, [])
}