javascript - 使用 Angular 6 循环复杂的 JSON 对象

标签 javascript json angular typescript

我有一个 JSON 对象,我只对其中一个关键“代码”及其值感兴趣。我想运行一个循环来获取每个地区、国家和城市的这些值并将它们存储在数组中。

{
"region":{
    "America":{
        "countries":{
            "US":{
                "cities":{
                    "NY":{
                        "codes":["142","2243","312","4123","5132"]
                    },
                    "LA":{
                        "codes":["1465","2465","3453","4132","542"]
                    }
                }
            },
            "CANADA":{
                "cities":{
                    "TORNTO":{
                        "codes":["1465","2465","3453","4132","542"]
                    }
                }

            }
        }
    },
    "ASIA":{
        "countries":{
            "India":{
                "cities":{
                    "Delhi ":{
                        "codes":["142","2243","312","4123","5132"]
                    },
                    "Calcutta":{
                        "codes":["1465","2465","3453","4132","542"]
                    }
                }
            },
            "CHINA":{
                "cities":{
                    "HONKKON":{
                        "codes":["1465","2465","3453","4132","542"]
                    }
                }

            }
        }
    }

}

}

我做了什么

getCodes(regions){
let ccode = [];
for (let key of Object.values(region)) {
    for (let temp of Object.values(key)) {
        for (let ctemp of Object.values(temp)) {
            for (btemp of Object.values(ctemp)) {
                for (let bbtemp of Object.values(btemp)) {
                    ccode.push(...bbtemp["code"])
}
            }
        }
    }

}

}

但是,我的全部兴趣是收集每个区域的代码值并将它们放在一个列表中。有什么实用的办法吗?

最佳答案

您可以采用如下递归方法:

const extractCodes = obj => {
  let codes = [];
  for (const key in obj) {
    if (key === 'codes') return [...obj[key]];
    else {
      codes = [...codes, ...extractCodes(obj[key])];
    }
  }
  return codes;
};

const region = {
  America: {
    countries: {
      US: {
        cities: {
          NY: {
            codes: ['142', '2243', '312', '4123', '5132']
          },
          LA: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      },
      CANADA: {
        cities: {
          TORNTO: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      }
    }
  },
  ASIA: {
    countries: {
      India: {
        cities: {
          'Delhi ': {
            codes: ['142', '2243', '312', '4123', '5132']
          },
          Calcutta: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      },
      CHINA: {
        cities: {
          HONKKON: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      }
    }
  }
};

console.log(extractCodes(region));

如果您只想提取唯一值(不重复的代码),您可以使用Set:

const extractCodes = obj => {
  let codes = [];
  for (const key in obj) {
    if (key === 'codes') return [...obj[key]];
    else {
      codes = [...new Set([...codes, ...extractCodes(obj[key])])];
    }
  }
  return codes;
};

const region = {
  America: {
    countries: {
      US: {
        cities: {
          NY: {
            codes: ['142', '2243', '312', '4123', '5132']
          },
          LA: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      },
      CANADA: {
        cities: {
          TORNTO: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      }
    }
  },
  ASIA: {
    countries: {
      India: {
        cities: {
          'Delhi ': {
            codes: ['142', '2243', '312', '4123', '5132']
          },
          Calcutta: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      },
      CHINA: {
        cities: {
          HONKKON: {
            codes: ['1465', '2465', '3453', '4132', '542']
          }
        }
      }
    }
  }
};

console.log(extractCodes(region));

关于javascript - 使用 Angular 6 循环复杂的 JSON 对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60121219/

相关文章:

javascript - 让目录中的所有文件成为 webpack 入口点的最佳方法?

javascript - 使用 IBM Tealeaf、require.js 和单页应用程序

javascript - 外部接口(interface)

java - JestResult.getSourceAsObjectList - 适用于 "@timestamp"或看似以 "@"开头的任何字段

angular - 在 IONIC v2 中从同一页面更改数据后如何使用新数据重新加载子页面

angular - 引用错误 : Cannot access Service' before initialization

javascript - 从值中删除对象

jquery - ASP.NET MVC - 从 IIS 接收 Json 响应时出现问题

iOS - 使用 Search API 进行 Google 购物

javascript - RXJS 6 处理 http Observables 的方式是什么?