首页 > 解决方案 > 如何访问 JSON 中的特定对象

问题描述

一个 API 返回一个如下所示的 JSON:

{
   "html_attributions" : [],
   "result" : {
      "address_components" : [
         {
            "long_name" : "1-3",
            "short_name" : "1-3",
            "types" : [ "street_number" ]
         },
         {
            "long_name" : "Acacia",
            "short_name" : "Acacia",
            "types" : [ "route" ]
         },
         {
            "long_name" : "Alamos 2da Sección",
            "short_name" : "Alamos 2da Secc",
            "types" : [ "sublocality_level_1", "sublocality", "political" ]
         },
         {
            "long_name" : "Santiago de Querétaro",
            "short_name" : "Santiago de Querétaro",
            "types" : [ "locality", "political" ]
         },
         {
            "long_name" : "Querétaro",
            "short_name" : "Qro.",
            "types" : [ "administrative_area_level_1", "political" ]
         },
         {
            "long_name" : "Mexico",
            "short_name" : "MX",
            "types" : [ "country", "political" ]
         },
         {
            "long_name" : "76160",
            "short_name" : "76160",
            "types" : [ "postal_code" ]
         }
      ]
   },
   "status" : "OK"
}

我想访问“sublocality”对象并读取它的值,在这种情况下是“alamos 2da secc”。我知道必须首先使用 JSON.parse 解析 JSON,但我不确定如何访问特定对象。是否需要 for 循环?或者有没有办法可以将每个对象的类型字段匹配为“子区域”

任何帮助表示赞赏。

标签: javascriptjson

解决方案


如果可能有多个地址是 sublocalities,我会采用这种方法:

const response = JSON.parse(apiResponse)
const addressesWithSublocality = response['result']['address_components'].filter(address=>{
    return address['types'].includes('sublocality')
})
console.log(addressesWithSublocality.map(address=>address['short_name']))

.filter函数接受一个数组并将其修剪为仅返回“true”的项目——在本例中,是types包含"sublocality".

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

.map函数返回一个新数组,该数组是对原始数组中的每个项目运行提供的函数的结果——在本例中,返回short_name每个地址的 。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

如果只有一个地址是 sublocality,我会采用这种方法:

const response = JSON.parse(apiResponse)
const addressWithSublocality = response['result']['address_components'].find(address=>{
    return address['types'].includes('sublocality')
})
console.log(address['short_name'])

.find类似于.filter它根据哪些项目返回“true”来修剪一个数组,但.find只返回一个项目,而.filter总是返回一个数组。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

注意:您可以只使用点表示法,而不是使用括号表示法,例如,response['result']['address_components']您可以编写response.result.address_components. 在访问 JSON 时,我只是更喜欢前一种语法。


推荐阅读