Want a single json array object from another multiple array objects for API consume using JavaScript

Question

1. I have below json data coming from another API. It displays country and Flag in separate Array objects

{
"data": [
            {
                "service": "Tourist Visa",
                "service_id": 2,
                "country_id": 2,
                "country_name": "Australia",
                "country_flag": "https://getset-visa.s3.amazonaws.com/images/flag/australia-flag.JPG"
            },
            {
                "service": "Tourist Visa",
                "service_id": 2,
                "country_id": 1,
                "country_name": "India",
                "country_flag": "https://getset-visa.s3.amazonaws.com/images/countries/Indian-Flag.png"
            },
            {
                "service": "Visa Services",
                "service_id": 3,
                "country_id": 1,
                "country_name": "India",
                "country_flag": "https://getset-visa.s3.amazonaws.com/images/countries/Indian-Flag.png"
            }
        ]
}

2. I want to convert it to like below, Using JavaScript for consuming in API. Like One country data in one array and another country data in separate array object along with country, flag and a services array

{
  "data": [
    {
      "countryName": "Australia",
      "countryFlag": "https://getset-visa.s3.amazonaws.com/images/flag/australia-flag.JPG",
      "services": [
        {
          "serviceName": "Tourist Visa"
        }
      ]
    },
    {
      "countryName": "India",
      "countryFlag": "https://getset-visa.s3.amazonaws.com/images/countries/Indian-Flag.png",
      "services": [
        {
          "serviceName": "Visa Services"
        },
        {
          "serviceName": "Tourist Visa"
        }
      ]
    }
  ]
}

Any help appreciated.

Welcome to Stack Overflow! Welcome to Stack Overflow! Visit the [help], take the [tour] to see what and [ask]. If you get stuck, post a [mcve] of your attempt, noting input and expected output using the [`[<>]`](https://meta.stackoverflow.com/questions/358992/ive-been-told-to-create-a-runnable-example-with-stack-snippets-how-do-i-do) snippet editor. — mplungjan, Apr 20 '21 at 08:16

Som Shekhar Mukherjee · Accepted Answer · 2021-04-20T08:51:45.963

1

You can use `Array#reduce` and `Map`.

const response = {
  data: [
    {
      service: "Tourist Visa",
      service_id: 2,
      country_id: 2,
      country_name: "Australia",
      country_flag:
        "https://getset-visa.s3.amazonaws.com/images/flag/australia-flag.JPG",
    },
    {
      service: "Tourist Visa",
      service_id: 2,
      country_id: 1,
      country_name: "India",
      country_flag:
        "https://getset-visa.s3.amazonaws.com/images/countries/Indian-Flag.png",
    },
    {
      service: "Visa Services",
      service_id: 3,
      country_id: 1,
      country_name: "India",
      country_flag:
        "https://getset-visa.s3.amazonaws.com/images/countries/Indian-Flag.png",
    },
  ],
};

const output = Array.from(response.data.reduce(
  (m, {country_id: id, country_name: countryName, country_flag: countryFlag, service: serviceName}) => (
    m.has(id)
      ? m.get(id).services.push({ serviceName })
      : m.set(id, { countryName, countryFlag, services: [{ serviceName }] }),
    m
  ),
  new Map()
).values());

console.log({data: output});

edited Apr 20 '21 at 08:51

answered Apr 20 '21 at 08:20

Som Shekhar Mukherjee

4,701
1
12
28

@VijayBhatia Please check if this solves your problem, do let me know if you have any issues. – Som Shekhar Mukherjee Apr 20 '21 at 08:23
@georg Oh my bad! Thanks for pointing out. I will update my answer. – Som Shekhar Mukherjee Apr 20 '21 at 08:28
Som. I want some different output – Vijay Bhatia Apr 20 '21 at 08:46
@VijayBhatia I've updated my answer, please take a look, is this what you want? – Som Shekhar Mukherjee Apr 20 '21 at 08:52
1

Yeah, @SomShekharMukherjee. its perfect. This is what i was looking for. Thanks a lot. – Vijay Bhatia Apr 20 '21 at 09:09

Want a single json array object from another multiple array objects for API consume using JavaScript

1 Answers1

You can use Array#reduce and Map.

You can use `Array#reduce` and `Map`.