Getting an array of specific key/value pairs from JSON file

user_13988691 0
Viewed 2431

Beginner here - I'd like to create an array for my cities of the world type ahead project from a JSON file. I've fetched the data, now I would like to extract 2 key/value pairs (called name/country) and push them into a new string array that will have the syntax:

const arr = ["name, country", "name, country", "name, country"...]

Here is a sample of the data:

[]:
0: {country: "Andorra", geonameid: 3040051, name: "les Escaldes", subcountry: "Escaldes-Engordany"}
1: {country: "Andorra", geonameid: 3041563, name: "Andorra la Vella", subcountry: "Andorra la Vella"}
2: {country: "United Arab Emirates", geonameid: 290594, name: "Umm al Qaywayn", subcountry: "Umm al Qaywayn"}
3: {country: "United Arab Emirates", geonameid: 291074, name: "Ras al-Khaimah", subcountry: "Raʼs al Khaymah"}...

I know I have to use .push() and .forEach() or a for loop but I'm not sure how to go about it. Can anyone show me how?

javascript-objects arrays json javascript
4 Answers

Use map like so:

const arr = data.map(city => city.name + ", " + city.country);

arr will be a new array of the same length as data where each city object in data is mapped to the string city.name + ", " + city.country.

Demo:

const data = [ {country: "Andorra", geonameid: 3040051, name: "les Escaldes", subcountry: "Escaldes-Engordany"}, {country: "Andorra", geonameid: 3041563, name: "Andorra la Vella", subcountry: "Andorra la Vella"}, {country: "United Arab Emirates", geonameid: 290594, name: "Umm al Qaywayn", subcountry: "Umm al Qaywayn"}, {country: "United Arab Emirates", geonameid: 291074, name: "Ras al-Khaimah", subcountry: "Raʼs al Khaymah"} ];

const arr = data.map(city => city.name + ", " + city.country);

console.log(arr);

user_98674510 

const data = [{country: "Andorra", geonameid: 3040051, name: "les Escaldes", subcountry: "Escaldes-Engordany"},
{country: "Andorra", geonameid: 3041563, name: "Andorra la Vella", subcountry: "Andorra la Vella"},
{country: "United Arab Emirates", geonameid: 290594, name: "Umm al Qaywayn", subcountry: "Umm al Qaywayn"},
{country: "United Arab Emirates", geonameid: 291074, name: "Ras al-Khaimah", subcountry: "Raʼs al Khaymah"}]

const arr = data.map(i => `${i.name} , ${i.country}`);
console.log(arr)

user_68663540

Simple Solution with forEach

countries = [
  {country: "Andorra", geonameid: 3040051, name: "les Escaldes", subcountry: "Escaldes-Engordany"},
  {country: "Andorra", geonameid: 3041563, name: "Andorra la Vella", subcountry: "Andorra la Vella"},
  {country: "United Arab Emirates", geonameid: 290594, name: "Umm al Qaywayn", subcountry: "Umm al Qaywayn"},
  {country: "United Arab Emirates", geonameid: 291074, name: "Ras al-Khaimah", subcountry: "Raʼs al Khaymah"}
]

let arr = [];

let result = [];

countries.forEach((country, index) => {
    let nameStr = `${country.name}, ${country.country}`
    result.push(nameStr);
})

console.log(result)

//output
//["les Escaldes Andorra", "Andorra la Vella Andorra", "Umm al Qaywayn United Arab Emirates", "Ras al-Khaimah United Arab Emirates"]

user_109711630

You can use reduce function if you want to:

arr.reduce((acc, curr) => [...acc, (`${curr.name}, ${curr.country}`)], []);

It will return your values in your desired format.

Example below.

const arr = [
    {country: 'Andorra', geonameid: 3040051, name: 'les 1', subcountry: 'Escaldes-Engordany'},
    {country: 'Turkey', geonameid: 3040021, name: 'les Escaldes', subcountry: 'aaaa'},
    {country: 'IDK', geonameid: 3040021, name: 'Wow', subcountry: 'aaaa'}
];
const custom = arr.reduce((acc, curr) => [...acc, (`${curr.name}, ${curr.country}`)], []);
console.log(custom);

user_123834860
Related