Javascript nested JSON merge specific object name value as string

Question

Using vanilla Javascript, I would like to return the city name of multiple location as a String in the nested JSON example below. Using push doesn't work because of the complexity of the JSON structure (I can't change) which result in a separate loop.

"locations":[
    {
      "location":{
          "city":"New place 1",
          "other":"random"
      }
    },
    {
      "location":{
          "city":"New place 2",
          "other":"random dom"
      }
    }
]

Expected output: "New place 1", "New place 2"

Thanks in advance.

Possible duplicate of [From an array of objects, extract value of a property as array](https://stackoverflow.com/questions/19590865/from-an-array-of-objects-extract-value-of-a-property-as-array) — Heretic Monkey, Feb 22 '19 at 12:50

doğukan · Answer 1 · 2019-02-22T12:52:22.113

Or, more easy solution.

let locations = [
    {
      "location":{
          "city":"New place 1",
          "other":"random"
      }
    },
    {
      "location":{
          "city":"New place 2",
          "other":"random dom"
      }
    }
];

let Array = [];
locations.forEach(function(par){
  Array.push(par.location.city);
})

let str = "";
Array.forEach(function(par){
  str += par +", ";
});

str = str.slice(0,-2);
  

console.log(str);

Nick Parsons · Answer 2 · 2019-02-22T12:54:30.857

You can use .reduce and template literals to build your string. Here I have also used .slice to remove the trailing comma and space at the end of your string:

const locs = {locations:[{location:{city:"New place 1",other:"random"}},{location:{city:"New place 2",other:"random dom"}}]},

res = locs.locations.reduce((acc, loc) => `${acc}${loc.location.city}, `, ``).slice(0,-2);
console.log(res);

If you just want an array as your output you can use .map:

 const locs = {locations:[{location:{city:"New place 1",other:"random"}},{location:{city:"New place 2",other:"random dom"}}]},
 
arr = locs.locations.map(loc => loc.location.city);
console.log(arr);

score 0 · Answer 3 · answered Feb 22 '19 at 12:49

0

You can use .map():

let locations = [
    {
      "location":{
          "city":"New place 1",
          "other":"random"
      }
    },
    {
      "location":{
          "city":"New place 2",
          "other":"random dom"
      }
    }
];

const result = locations.map(loc => loc.location.city);

console.log(result);
console.log(result.join(','));

answered Feb 22 '19 at 12:49

Sebastian Kaczmarek

8,120
4
20
38

Thanks a lot. Work like a charm. – Shiro Feb 22 '19 at 13:10

score 0 · Answer 4 · answered Feb 22 '19 at 12:51

Use Array.map and Array.join

let locations = [{"location":{"city":"New place 1","other":"random"}},{"location":{"city":"New place 2","other":"random dom"}}];

let result = locations.map(v => '"' + v.location.city + '"').join(", ");
console.log(result);

score 0 · Answer 5 · answered Feb 22 '19 at 12:53

const locs = [
    {
      "location":{
          "city":"New place 1",
          "other":"random"
      }
    },
    {
      "location":{
          "city":"New place 2",
          "other":"random dom"
      }
    }
]

const res = locs.map(d => d.location.city).join(', ');
console.log(res); // "New place 1, New place 2"

Nice and simple with locs.map(d => d.location.city).join(', ')

score 0 · Answer 6 · answered Feb 22 '19 at 12:54

One liner Using map and String constructor

var a = {
  locations: [{
    location: {
      city: "New place 1",
      other: "random"
    }
  }, {
    location: {
      city: "New place 2",
      other: "random dom"
    }
  }]
}
console.log(String(a.locations.map(e => e.location.city)))

Javascript nested JSON merge specific object name value as string

6 Answers6