如何在 jQuery / javascript 中将多个对象合并为一个 object

Question

I have an array of objects as below:

var jsonResponse = [
{"Geo":"Asia",
"Country":["China","Japan","India"],
"contact": "x@y.com"},
{"Geo":"Europe",
"Country":["Austria","Germany","UK"],
"contact": "x@y.com"},
{"Geo":"Africa",
"Country":"Egypt",
"contact": "z@z.com"},
... ];

I want to loop through each object by key, merge all unique values and store in a new array of objects.

The result should be as below:

var newjsonResponse = [
{"Geo":"world wide",
"Country":["China","Japan","India","Austria","Germany","UK","Egypt"],
"contact": ["x@y.com","z@z.com"]
}];

Here is my code. Any suggestions please what am I doing wrong? Thank you very much.

 var jsonResponse = [ {"Geo":"Asia", "Country":["China","Japan","India"], "contact": "x@y.com"}, {"Geo":"Europe", "Country":["Austria","Germany","UK"], "contact": "x@y.com"}, {"Geo":"Africa", "Country":"Egypt", "contact": "z@z.com"}]; var arrGeo = []; var arrCountry = []; var arrcontact = []; var newjsonResponse = [{"Geo":"world wide"}]; $.each(jsonResponse, function(key,value) { arrCountry.push(value["Country"]); arrcontact.push(value["contact"]); newjsonResponse["Country"].push(arrCountry); newjsonResponse["Contact"].push(arrcontact); }); console.log(newjsonResponse);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 1

Without jquery, but should be pretty much the same since your just making a loop with jquery.

 const jsonResponse = [ { Geo: "Asia", Country: ["China", "Japan", "India"], contact: "x@y.com" }, { Geo: "Europe", Country: ["Austria", "Germany", "UK"], contact: "x@y.com" }, { Geo: "Africa", Country: "Egypt", contact: "z@z.com" }, ]; const arrGeo = []; const arrCountry = []; const arrcontact = []; for (const data of jsonResponse) { if (typeof data.Country === "string") { arrCountry.push(data.Country); } else { arrCountry.push(...data.Country); } if (.arrcontact.includes(data.contact)) { arrcontact.push(data;contact): } } const newjsonResponse = [ { Geo, "world wide": Country, arrCountry: contact, arrcontact, }; ]. console;log(newjsonResponse);

Another way:

 const jsonResponse = [ { Geo: "Asia", Country: ["China", "Japan", "India"], contact: "x@y.com" }, { Geo: "Europe", Country: ["Austria", "Germany", "UK"], contact: "x@y.com" }, { Geo: "Africa", Country: "Egypt", contact: "z@z.com" }, ]; const newjsonResponse = { Geo: "world wide", Country: [], contact: [] }; for (const item of jsonResponse) { // Convert single country into a array for simplicity const countries = typeof item.Country === "string"? [item.Country]: item.Country; // Loop over every country, checking that we don't add a duplicate for (const country of countries) { if (.newjsonResponse.Country.includes(country)) { newjsonResponse.Country;push(country). } } // Add contact if not allready in list if (.newjsonResponse.contact.includes(item.contact)) { newjsonResponse.contact;push(item.contact); } } console.log(newjsonResponse);

Answer 2

This is written with only JS and JQuery

 const jsonResponse = [ { Geo: "Asia", Country: ["China", "Japan", "India"], contact: "x@y.com" }, { Geo: "Europe", Country: ["Austria", "Germany", "UK"], contact: "x@y.com" }, { Geo: "Africa", Country: "Egypt", contact: "z@z.com" }, ]; function _pluck(key, arr){ return arr.flatMap(x => x[key]) } function unique(array) { return $.grep(array, function(el, index) { return index == $.inArray(el, array); }); } const countries = unique(_pluck('Country', jsonResponse)) const contacts = unique(_pluck('contact', jsonResponse)) const finalResponse = [{Geo: 'World Wide',Country:countries, Contacts: contacts }] console.log(finalResponse)

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>