js多层嵌套数据递归算法怎么改成迭代

Question

因为后台给的数据参数跟跟前端需要的不一样，后台给的数据如下（有多层嵌套）：

code: null
id: 1
name: "业务功能菜单"
parentId: null
sort: null
type: null
child: [{
    code: "eos-admin-store-control"
    id: 3
    name: "eos管理员门店管理"
    parentId: 1
    sort: null
    type: null,
     child: [{
        code: "eos-admin-store-list"
        id: 4
        name: "eos管理员门店列表"
        parentId: 3
        sort: null
        type: null,
        child: []
     },
     {
        code: "eos-admin-store-list"
        id: 5
        name: "eos11111111"
        parentId: 3
        sort: null
        type: null,
        child: []
     }
     ]
}]

如何用迭代的方式，替换成递归？因为递归影响性能。

根据插件需求，遍历成对应的参数，参数格式如下：

fromData:[
        {
          id: "1",
          pid: 0,
          label: "一级 1",
          children: [
            {
              id: "1-1",
              pid: "1",
              label: "二级 1-1",
              children: []
            },
            {
              id: "1-2",
              pid: "1",
              label: "二级 1-2",
              children: [
                {
                  id: "1-2-1",
                  pid: "1-2",
                  children: [],
                  label: "二级 1-2-1"
                },
                {
                  id: "1-2-2",
                  pid: "1-2",
                  children: [],
                  label: "二级 1-2-2"
                }
              ]
            },

            {
              id: "2-1",
              pid: "1",
              label: "仨级 1-2",
              children: [
                {
                  id: "2-2-1",
                  pid: "2-1",
                  children: [],
                  label: "仨级 1-2-1"
                },
                {
                  id: "2-2-2",
                  pid: "2-1",
                  children: [],
                  label: "仨级 1-2-2"
                }
              ]
            }
          ]
        },
      ]

Answer 1

这种不定层级情景下用递归最合适了吧，这种数据结构转换也就是拿到数据转换一次而已，计算量能有多少啊，居然开始担心递归影响性能了？你要追求性能应该让后端改格式

---

const createData = ({level, size, _level, pid}) => {
  const result = [];
  _level = _level || 0;
  size = size || 1;
  for (let i = 0; i < size; i++) {
    const id = `${_level}-${i}`;
    result.push({
      id,
      parentId: pid || '',
      name: `${_level}级 ${i}`,
      child: _level < level ? createData({level, size, _level: _level + 1, pid: id}) : [],
    });
  }
  return result;
};

const recursionChange = data => data.map(item => ({
  id: item.id,
  pid: item.parentId,
  label: item.name,
  children: recursionChange(item.child),
}));

console.time('create');
const data = createData({level: 10, size: 3});
console.timeEnd('create');

console.time('recursion');
const changeData = recursionChange(data);
console.timeEnd('recursion');

console.log(data, changeData);

刚才想不开想去测试一下题主说的递归影响性能是否存在写下上面测试代码，3的10次方+的对象够大够深吧，37ms就递归转换了，完全不存在性能问题啊

Answer 2

可以，但没必要。非要用那就用while吧，外面维护一个结果，里面一直调用，当满足完成条件时break也可以，ps递归影响性能多半是你使用递归的姿势不对，尾递归了解一下