调用json时将动态索引结构负载转换为Array

2024-05-18 • 问答

我有这样的文件结构：

{
  "hierarchy": [
    {
      "type": "folder","name": "src","child": [
        {
          "type": "folder","name": "assets","child": [
            {
              "type": "folder","name": "styles","child": [
                {
                  "type": "file","name": "style.css","data": "style"
                }
              ]
            },{
              "type": "folder","name": "scripts","name": "script.js","data": "script"
                }
              ]
            }
          ]
        },{
          "type": "file","name": "index.html","data": "html"
        },"name": "manifest.json","data": "manifest"
        }
      ]
    },{
      "type": "folder","name": "dist","child": []
    }
  ]
}

侦听此根目录和所有子目录，并创建一个反映此目录结构的Array，每个节点包含类型，名称，路径和子级：

[
    ["folder","src","./"],["file","index.html","./src/"],["folder","assets","styles","./src/assets/"],"scripts","style.css","./src/assets/styles/"],"script.js","./src/assets/scripts/"],"dist","./"]
]

我想动态监听JSON文件并创建一个数组，如示例所示。

您可以采用递归方法并迭代给定的树。

function getFlat(array,path = './') {
    return array.reduce((r,{ type,name,child = [] }) => {
        r.push([type,path],...getFlat(child,`${path}${name}/`));
        return r;
    },[]);
}

var tree = { hierarchy: [{ type: "folder",name: "src",child: [{ type: "folder",name: "assets",name: "styles",child: [{ type: "file",name: "style.css",data: "style" }] },{ type: "folder",name: "scripts",name: "script.js",data: "script" }] }] },{ type: "file",name: "index.html",data: "html" },name: "manifest.json",data: "manifest" }] },name: "dist",child: [] }] },result = getFlat(tree.hierarchy);    

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

您可以像这样递归实现：

function getEntriesFromHierarchy(hierarchy,path,entries = []) {
    entries.push([ hierarchy.type,hierarchy.name,path ]);

    if(hierarchy.type === "folder") {
        hierarchy.child.forEach(childHierarchy =>
            getEntriesFromHierarchy(childHierarchy,path + hierarchy.name + "/",entries)
        );
    }

    return entries;
}

let results = yourObject.hierarchy.reduce((acc,hierarchy) => 
    acc.concat(getEntriesFromHierarchy(hierarchy,"./")),[]);

getEntriesFromHierarchy将与层次结构对象相对应的条目添加到数组entries中，如果该层次结构是一个文件夹，它将在该文件夹的每个子层次结构上进行调用。它传递数组entries，以便每次使用它而不是创建一个新数组，因此层次结构中的所有文件都包含在同一数组中。

由于您的对象hierarchy属性是一个层次结构数组，因此我们使用reduce将所有结果数组连接到results数组中。对数组getEntriesFromHierarchy中的层次结构进行的每次hierarchy调用都将返回对应于该特定层次结构的结果数组，因此我们需要将所有这些数组合并为一个，这就是代码的第二部分负责。

调用json时将动态索引结构负载转换为Array

wkao0705120104 回答：调用json时将动态索引结构负载转换为Array

大家都在问