封装树形数组扁平化函数

前段时间开发实例化标准，遇到深层树形结构数组且每层子数组或者子对象的字段名都不同的场景下，进行数组扁平化问题，这周基于该场景整理封装一个扁平化函数flattenArr

1.定义一个数组存储扁平化的结果

2.遍历节点并将其添加到result结果数组中

4.遍历传入的keys数组，如果当前节点的key对应的值是一个数组

5.遍历该数组中的子节点，如果子节点是一个对象，递归调用cycleFn函数，继续遍历子节点

6.返回扁平化后的结果数组

flattenArr(arr, keys) {
      const result = [];
      function cycleFn(node) {
        result.push(node);
        for (const key of keys) {
          if (Array.isArray(node[key])) {
            node[key].forEach((child) => {
              if (typeof child === "object" && child !== null) {
                cycleFn(child);
              }
            });
          } else if (typeof node[key] === "object" && node[key] !== null) {
            cycleFn(node[key]);
          }
        }
      }
      arr.forEach((node) => {
        cycleFn(node);
      });
      return result;
    },

该函数接收两个参数，第一个参数是需要扁平化的数组Array，第二个参数是子数组或者对象的key；

数据转换示例如下：

b. 数据转换示例----原始数组
该数组下每个数组或者对象的key字段名都不相同

      let data = [
        {
          id: "1",
          name: "A",
          children: [
            {
              id: "2",
              name: "B",
              child: [
                {
                  id: "3",
                  name: "C",
                  arr: [
                    {
                      id: "4",
                      name: "D",
                      lastLayer: [
                        {
                          id: "5",
                          name: "E",
                        },
                      ],
                    },
                  ],
                },
              ],
            },
          ],
        },
      ];

      [
        { id: "1", name: "A", children: Array(1) },
        { id: "2", name: "B", child: {...} },
        { id: "3", name: "C", arr: Array(1) },
        { id: "4", name: "D", lastLayer: Array(1) },
        { id: "5", name: "E" },
      ];

const keys = ["children", "child", "arr", "lastLayer"];
const flattened = this.flattenArr(data, keys);
console.log(flattened)