如何访问JSON中的特定对象

Question

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“对象并读取它的值，在本例中是”Alamos2daSECC“。我知道必须首先使用JSON.parse解析JSON，但我不确定如何访问特定的对象。有必要使用for循环吗？或者我是否可以将每个对象的类型字段匹配为“子局部性”？

如能提供任何协助，我们将不胜感激。

Answer 1

如果可能有多个子地点地址，我将采用以下方法：

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"的地址。

对象/数组/筛选器

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

对象/数组/地图

如果只有一个地址是分区，我将采用以下方法：

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总是返回一个数组。

对象/数组/查找

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

Answer 2

使用数组查找()查找所需的对象。

​

var data = `{"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"}`

data = JSON.parse(data)

var res = data['result']['address_components'].find((e) => {return e.types.indexOf('sublocality') !== -1})

console.log(res['short_name'])

​

Answer 3

使用Array#filter查找与作为参数传递的类型匹配的所有名称。

可能有不止一种可能的匹配。

​

const data ={"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"};

function findMatches(type){
  return data.result.address_components
  .filter(({types})=>types.includes(type))
  .map(({short_name})=>short_name)
  .join(", ");
}

const res = findMatches("sublocality");

console.log(res);

​