遍历具有深层嵌套对象和数组的对象数组

时间:2019-12-22 00:59:46

标签: javascript arrays json vue.js

我有一个从Collection > Folder/Request > Request结构生成的JSON数组。

示例:

[
  {
    "name": "My Collection",
    "folders": [
      {
        "name": "bdg",
        "requests": [
          {
            "url": "https://reqres.in",
            "path": "/api/users",
            "method": "GET",
            "auth": "None",
            "httpUser": "",
            "httpPassword": "",
            "passwordFieldType": "password",
            "bearerToken": "",
            "headers": [],
            "params": [],
            "bodyParams": [],
            "rawParams": "",
            "rawInput": false,
            "contentType": "application/json",
            "requestType": "cURL",
            "name": "My Request",
            "collection": 0
          }
        ]
      }
    ],
    "requests": [
      {
        "url": "https://reqres.in",
        "path": "/api/users",
        "method": "GET",
        "auth": "None",
        "httpUser": "",
        "httpPassword": "",
        "passwordFieldType": "password",
        "bearerToken": "",
        "headers": [],
        "params": [],
        "bodyParams": [],
        "rawParams": "",
        "rawInput": false,
        "contentType": "application/json",
        "requestType": "cURL",
        "name": "My Request",
        "collection": 0
      }
    ]
  },
  {
    "name": "fndo",
    "folders": [
      {
        "name": "bdghg",
        "requests": [
          {
            "url": "https://reqres.in",
            "path": "/api/users",
            "method": "GET",
            "auth": "None",
            "httpUser": "",
            "httpPassword": "",
            "passwordFieldType": "password",
            "bearerToken": "",
            "headers": [],
            "params": [],
            "bodyParams": [],
            "rawParams": "",
            "rawInput": false,
            "contentType": "application/json",
            "requestType": "cURL",
            "name": "My Request",
            "collection": 1
          }
        ]
      }
    ],
    "requests": [
      {
        "url": "https://reqres.in",
        "path": "/api/users",
        "method": "GET",
        "auth": "None",
        "httpUser": "",
        "httpPassword": "",
        "passwordFieldType": "password",
        "bearerToken": "",
        "headers": [],
        "params": [],
        "bodyParams": [],
        "rawParams": "",
        "rawInput": false,
        "contentType": "application/json",
        "requestType": "cURL",
        "name": "My Request",
        "collection": 1
      }
    ]
  }
]

我想遍历此JSON中的所有节点,数组和对象。 JSON将由对象,对象数组和数组组成。

我尝试了Object.keys().map().forEach(),但是在嵌套条件下失败了。

具有递归的E6S解决方案将挽救生命。

提前谢谢!

2 个答案:

答案 0 :(得分:0)

如果目标是将此JSON转换为对象,那么最好的解决方案是解析JSON。例如:

let myJson = "[
  {
    "name": "Collection 1",
  },
  {
    "name": "Collection 2",
  },
  {
    "name": "Collection 3",
  }
]"

下一步是使用JSON.parse()函数

let myObj = JSON.parse(myJson);

现在,您可以根据需要轻松地循环播放

for(let i = 0; i < myObj.length; i++){
  console.log(myObj[i].name);
}

或者直接访问任何属性

let name1 = myObj[0].name;

答案 1 :(得分:0)

@codingspear的答案恰好是我在寻找https://stackoverflow.com/a/59441109/8335089

我能够使用以下方法遍历所有节点:

      let collections = JSON.parse(myJson);
      for (let i = 0; i < collections.length; i++) {
        console.log("Collection", i + 1, collections[i].name);
        let folders = collections[i].folders;
        for (let i = 0; i < folders.length; i++) {
          console.log("Folder", i + 1, folders[i].name);
          let requests = collections[i].requests;
          for (let i = 0; i < requests.length; i++) {
            console.log("Request", i + 1, requests[i].name);
          }
        }
        let requests = collections[i].requests;
        for (let i = 0; i < requests.length; i++) {
          console.log("Request", i + 1, requests[i].name);
        }
      }