javascriptjquerytypescript

How to iterate `address_component` to get the `country` or any


In my application, I am getting long data from google. i know that we can iterate and get the value. But I am sure that always the google result will be the same as i got. In that case what would be the correct approach to get the country name always with safe way?

here is the result i am getting at preset:

{
  "results": [
    {
      "address_components": [
        {
          "long_name": "49",
          "short_name": "49",
          "types": [
            "street_number"
          ]
        },
        {
          "long_name": "Sydenhams Road",
          "short_name": "Sydenhams Rd",
          "types": [
            "route"
          ]
        },
        {
          "long_name": "Park Town",
          "short_name": "Park Town",
          "types": [
            "political",
            "sublocality",
            "sublocality_level_1"
          ]
        },
        {
          "long_name": "Chennai",
          "short_name": "Chennai",
          "types": [
            "locality",
            "political"
          ]
        },
        {
          "long_name": "Chennai",
          "short_name": "Chennai",
          "types": [
            "administrative_area_level_2",
            "political"
          ]
        },
        {
          "long_name": "Tamil Nadu",
          "short_name": "TN",
          "types": [
            "administrative_area_level_1",
            "political"
          ]
        },
        {
          "long_name": "India",
          "short_name": "IN",
          "types": [
            "country",
            "political"
          ]
        },
        {
          "long_name": "600003",
          "short_name": "600003",
          "types": [
            "postal_code"
          ]
        }
      ],
      "formatted_address": "49, Sydenhams Rd, Park Town, Chennai, Tamil Nadu 600003, India",
      "geometry": {
        "location": {
          "lat": 13.0826869,
          "lng": 80.27050659999999
        },
        "location_type": "ROOFTOP",
        "viewport": {
          "northeast": {
            "lat": 13.0840358802915,
            "lng": 80.2718555802915
          },
          "southwest": {
            "lat": 13.0813379197085,
            "lng": 80.2691576197085
          }
        }
      },
      "place_id": "ChIJ11Py-v1lUjoROzu_lR9o7io",
      "types": [
        "street_address"
      ]
    },
    {
      "address_components": [
        {
          "long_name": "Raja Flats",
          "short_name": "Raja Flats",
          "types": [
            "establishment",
            "point_of_interest"
          ]
        },
        {
          "long_name": "School Street",
          "short_name": "School St",
          "types": [
            "route"
          ]
        },
        {
          "long_name": "Srinivasa Nagar",
          "short_name": "Srinivasa Nagar",
          "types": [
            "political",
            "sublocality",
            "sublocality_level_2"
          ]
        },
        {
          "long_name": "Perambur",
          "short_name": "Perambur",
          "types": [
            "political",
            "sublocality",
            "sublocality_level_1"
          ]
        },
        {
          "long_name": "Chennai",
          "short_name": "Chennai",
          "types": [
            "locality",
            "political"
          ]
        },
        {
          "long_name": "Chennai",
          "short_name": "Chennai",
          "types": [
            "administrative_area_level_2",
            "political"
          ]
        },
        {
          "long_name": "Tamil Nadu",
          "short_name": "TN",
          "types": [
            "administrative_area_level_1",
            "political"
          ]
        },
        {
          "long_name": "India",
          "short_name": "IN",
          "types": [
            "country",
            "political"
          ]
        },
        {
          "long_name": "600110",
          "short_name": "600110",
          "types": [
            "postal_code"
          ]
        }
      ],
      "formatted_address": "Raja Flats, 600003, School St, Srinivasa Nagar, Perambur, Chennai, Tamil Nadu 600110, India",
      "geometry": {
        "location": {
          "lat": 13.0826802,
          "lng": 80.2707184
        },
        "location_type": "GEOMETRIC_CENTER",
        "viewport": {
          "northeast": {
            "lat": 13.0840291802915,
            "lng": 80.27206738029152
          },
          "southwest": {
            "lat": 13.0813312197085,
            "lng": 80.26936941970851
          }
        }
      },
      "place_id": "ChIJkRKg-_1lUjoR5ts0tmVrxMg",
      "types": [
        "establishment",
        "point_of_interest"
      ]
    }
  ],
  "status": "OK"
}

Solution

  • In that case what would be the correct approach to get the country name always with safe way?

    To get country names, use map, find and includes

    var countries = obj.results.map( s => s.address_components.find ( t => t.types.includes( "country" ) ).long_name )
    

    To get unique countries, use Set and spread operator ... to Array

    countries = [...new Set( countries )];
    

    Demo

    var obj = {
      "results": [{
          "address_components": [{
              "long_name": "49",
              "short_name": "49",
              "types": [
                "street_number"
              ]
            },
            {
              "long_name": "Sydenhams Road",
              "short_name": "Sydenhams Rd",
              "types": [
                "route"
              ]
            },
            {
              "long_name": "Park Town",
              "short_name": "Park Town",
              "types": [
                "political",
                "sublocality",
                "sublocality_level_1"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "locality",
                "political"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "administrative_area_level_2",
                "political"
              ]
            },
            {
              "long_name": "Tamil Nadu",
              "short_name": "TN",
              "types": [
                "administrative_area_level_1",
                "political"
              ]
            },
            {
              "long_name": "India",
              "short_name": "IN",
              "types": [
                "country",
                "political"
              ]
            },
            {
              "long_name": "600003",
              "short_name": "600003",
              "types": [
                "postal_code"
              ]
            }
          ],
          "formatted_address": "49, Sydenhams Rd, Park Town, Chennai, Tamil Nadu 600003, India",
          "geometry": {
            "location": {
              "lat": 13.0826869,
              "lng": 80.27050659999999
            },
            "location_type": "ROOFTOP",
            "viewport": {
              "northeast": {
                "lat": 13.0840358802915,
                "lng": 80.2718555802915
              },
              "southwest": {
                "lat": 13.0813379197085,
                "lng": 80.2691576197085
              }
            }
          },
          "place_id": "ChIJ11Py-v1lUjoROzu_lR9o7io",
          "types": [
            "street_address"
          ]
        },
        {
          "address_components": [{
              "long_name": "Raja Flats",
              "short_name": "Raja Flats",
              "types": [
                "establishment",
                "point_of_interest"
              ]
            },
            {
              "long_name": "School Street",
              "short_name": "School St",
              "types": [
                "route"
              ]
            },
            {
              "long_name": "Srinivasa Nagar",
              "short_name": "Srinivasa Nagar",
              "types": [
                "political",
                "sublocality",
                "sublocality_level_2"
              ]
            },
            {
              "long_name": "Perambur",
              "short_name": "Perambur",
              "types": [
                "political",
                "sublocality",
                "sublocality_level_1"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "locality",
                "political"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "administrative_area_level_2",
                "political"
              ]
            },
            {
              "long_name": "Tamil Nadu",
              "short_name": "TN",
              "types": [
                "administrative_area_level_1",
                "political"
              ]
            },
            {
              "long_name": "India",
              "short_name": "IN",
              "types": [
                "country",
                "political"
              ]
            },
            {
              "long_name": "600110",
              "short_name": "600110",
              "types": [
                "postal_code"
              ]
            }
          ],
          "formatted_address": "Raja Flats, 600003, School St, Srinivasa Nagar, Perambur, Chennai, Tamil Nadu 600110, India",
          "geometry": {
            "location": {
              "lat": 13.0826802,
              "lng": 80.2707184
            },
            "location_type": "GEOMETRIC_CENTER",
            "viewport": {
              "northeast": {
                "lat": 13.0840291802915,
                "lng": 80.27206738029152
              },
              "southwest": {
                "lat": 13.0813312197085,
                "lng": 80.26936941970851
              }
            }
          },
          "place_id": "ChIJkRKg-_1lUjoR5ts0tmVrxMg",
          "types": [
            "establishment",
            "point_of_interest"
          ]
        }
      ],
      "status": "OK"
    };
    
    var countries = obj.results.map(s => s.address_components.find(t => t.types.includes("country")).long_name)
    
    countries = [...new Set(countries)]; //comment this line if uniqueness is not required
    
    console.log(countries);

    To get country's short_name as well

    Demo

    var obj = {
      "results": [{
          "address_components": [{
              "long_name": "49",
              "short_name": "49",
              "types": [
                "street_number"
              ]
            },
            {
              "long_name": "Sydenhams Road",
              "short_name": "Sydenhams Rd",
              "types": [
                "route"
              ]
            },
            {
              "long_name": "Park Town",
              "short_name": "Park Town",
              "types": [
                "political",
                "sublocality",
                "sublocality_level_1"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "locality",
                "political"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "administrative_area_level_2",
                "political"
              ]
            },
            {
              "long_name": "Tamil Nadu",
              "short_name": "TN",
              "types": [
                "administrative_area_level_1",
                "political"
              ]
            },
            {
              "long_name": "India",
              "short_name": "IN",
              "types": [
                "country",
                "political"
              ]
            },
            {
              "long_name": "600003",
              "short_name": "600003",
              "types": [
                "postal_code"
              ]
            }
          ],
          "formatted_address": "49, Sydenhams Rd, Park Town, Chennai, Tamil Nadu 600003, India",
          "geometry": {
            "location": {
              "lat": 13.0826869,
              "lng": 80.27050659999999
            },
            "location_type": "ROOFTOP",
            "viewport": {
              "northeast": {
                "lat": 13.0840358802915,
                "lng": 80.2718555802915
              },
              "southwest": {
                "lat": 13.0813379197085,
                "lng": 80.2691576197085
              }
            }
          },
          "place_id": "ChIJ11Py-v1lUjoROzu_lR9o7io",
          "types": [
            "street_address"
          ]
        },
        {
          "address_components": [{
              "long_name": "Raja Flats",
              "short_name": "Raja Flats",
              "types": [
                "establishment",
                "point_of_interest"
              ]
            },
            {
              "long_name": "School Street",
              "short_name": "School St",
              "types": [
                "route"
              ]
            },
            {
              "long_name": "Srinivasa Nagar",
              "short_name": "Srinivasa Nagar",
              "types": [
                "political",
                "sublocality",
                "sublocality_level_2"
              ]
            },
            {
              "long_name": "Perambur",
              "short_name": "Perambur",
              "types": [
                "political",
                "sublocality",
                "sublocality_level_1"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "locality",
                "political"
              ]
            },
            {
              "long_name": "Chennai",
              "short_name": "Chennai",
              "types": [
                "administrative_area_level_2",
                "political"
              ]
            },
            {
              "long_name": "Tamil Nadu",
              "short_name": "TN",
              "types": [
                "administrative_area_level_1",
                "political"
              ]
            },
            {
              "long_name": "India",
              "short_name": "IN",
              "types": [
                "country",
                "political"
              ]
            },
            {
              "long_name": "600110",
              "short_name": "600110",
              "types": [
                "postal_code"
              ]
            }
          ],
          "formatted_address": "Raja Flats, 600003, School St, Srinivasa Nagar, Perambur, Chennai, Tamil Nadu 600110, India",
          "geometry": {
            "location": {
              "lat": 13.0826802,
              "lng": 80.2707184
            },
            "location_type": "GEOMETRIC_CENTER",
            "viewport": {
              "northeast": {
                "lat": 13.0840291802915,
                "lng": 80.27206738029152
              },
              "southwest": {
                "lat": 13.0813312197085,
                "lng": 80.26936941970851
              }
            }
          },
          "place_id": "ChIJkRKg-_1lUjoR5ts0tmVrxMg",
          "types": [
            "establishment",
            "point_of_interest"
          ]
        }
      ],
      "status": "OK"
    };
    
    var countries = obj.results.map(s => {
       var obj = s.address_components.find(t => t.types.includes("country"));
       return { long_name : obj.long_name, short_name : obj.short_name };
    })
    
    //countries = [...new Set(countries)]; //comment this line if uniqueness is not required
    
    console.log(countries);