Develop Reference

How to calculate x and y for a rythem music game notes from a midi json file

I have never created a game a before and I am thinking of developing one now.
The game I am thinking o creating is a rythem game, kinda of like gitar hero.
So the first think I hade to do is gettings the notes of an mp3 file.
and this is what I got.
{
"header": {
"PPQ": 46,
"bpm": 120,
"name": ""
},
"tempo": [{
"absoluteTime": 0,
"seconds": 0,
"bpm": 120
}
],
"timeSignature": [],
"startTime": 0,
"duration": 279.08695652187913,
"tracks": [{
"startTime": 0,
"duration": 279.08695652187913,
"length": 29841,
"notes": [{
"name": "G#4",
"midi": 68,
"time": 0,
"velocity": 0.11811023622047244,
"duration": 0.21739130434782608
}, {
"name": "G#4",
"midi": 68,
"time": 0.32608695652173914,
"velocity": 0.14960629921259844,
"duration": 0.09782608695652173
}, {
"name": "C#3",
"midi": 49,
"time": 0.6304347826086957,
"velocity": 0.07874015748031496,
"duration": 0.07608695652173914
}, {
"name": "G#4",
"midi": 68,
"time": 0.7065217391304348,
"velocity": 0.07086614173228346,
"duration": 0.03260869565217395
}, {
"name": "C#5",
"midi": 73,
"time": 0.891304347826087,
"velocity": 0.09448818897637795,
"duration": 0.08695652173913049
}, {
"name": "C#3",
"midi": 49,
"time": 1.0543478260869565,
"velocity": 0.14173228346456693,
"duration": 0.5326086956521743
}, {
"name": "G#4",
"midi": 68,
"time": 1.1521739130434783,
"velocity": 0.13385826771653545,
"duration": 0.11956521739130443
}, {
"name": "C#5",
"midi": 73,
"time": 1.173913043478261,
"velocity": 0.12598425196850394,
"duration": 0.10869565217391308
}, {
"name": "G#4",
"midi": 68,
"time": 1.3913043478260871,
"velocity": 0.12598425196850394,
"duration": 0.20652173913043503
}, {
"name": "C#5",
"midi": 73,
"time": 1.5108695652173916,
"velocity": 0.11023622047244094,
"duration": 0.0652173913043479
}, {
"name": "G#4",
"midi": 68,
"time": 1.695652173913044,
"velocity": 0.14960629921259844,
"duration": 0.17391304347826075
}, {
"name": "C#3",
"midi": 49,
"time": 2.021739130434783,
"velocity": 0.14173228346456693,
"duration": 0.5326086956521738
}, {
"name": "G#4",
"midi": 68,
"time": 2.0326086956521743,
"velocity": 0.18110236220472442,
"duration": 0.1304347826086958
}, {
"name": "G#4",
"midi": 68,
"time": 2.5108695652173916,
"velocity": 0.11811023622047244,
"duration": 0.20652173913043503
}, {
"name": "C#3",
"midi": 49,
"time": 2.7826086956521743,
"velocity": 0.16535433070866143,
"duration": 0.9347826086956523
}, {
"name": "G#4",
"midi": 68,
"time": 2.8695652173913047,
"velocity": 0.13385826771653545,
"duration": 0.1521739130434785
}, {
"name": "G#4",
"midi": 68,
"time": 3.1304347826086962,
"velocity": 0.15748031496062992,
"duration": 0.46739130434782616
}, {
"name": "G#4",
"midi": 68,
"time": 3.760869565217392,
"velocity": 0.13385826771653545,
"duration": 0.14130434782608692
}, {
"name": "C#3",
"midi": 49,
"time": 3.9239130434782616,
"velocity": 0.14173228346456693,
"duration": 0.2065217391304346
}, {
"name": "G#4",
"midi": 68,
"time": 3.9239130434782616,
"velocity": 0.16535433070866143,
"duration": 0.16304347826086918
}, {
"name": "G#4",
"midi": 68,
"time": 4.119565217391305,
"velocity": 0.2677165354330709,
"duration": 0.3913043478260869
}, {
"name": "G#4",
"midi": 68,
"time": 4.543478260869565,
"velocity": 0.1889763779527559,
"duration": 0.06521739130434767
}, {
"name": "G#4",
"midi": 68,
"time": 4.630434782608695,
"velocity": 0.2677165354330709,
"duration": 0.7065217391304346
}, {
"name": "G#4",
"midi": 68,
"time": 5.434782608695651,
"velocity": 0.30708661417322836,
"duration": 0.6847826086956523
}, {
"name": "G#4",
"midi": 68,
"time": 6.152173913043478,
"velocity": 0.2047244094488189,
"duration": 0.23913043478260843
}, {
"name": "C#3",
"midi": 49,
"time": 6.2934782608695645,
"velocity": 0.10236220472440945,
"duration": 0.09782608695652151
},
],
"controlChanges": {},
"id": 0,
"instrumentNumber": 0,
"instrument": "acoustic grand piano",
"instrumentFamily": "piano",
"channelNumber": 0,
"isPercussion": false
}
]
}
Now how can I convert the notes to x , y and speed
something like below json
const balls =[
{
x: number,
y: number,
speed: number
}
]
I could not find any lesson on how to calculate them.
I want to build this in react-native and this is really a challenge for me.
If you could point me in the right direction or maybe tell me how is it possible to convert the notes would be really helpful

React - Displaying items that are found in two different APIs and have matching IDs

I'm having issues displaying items in React, I was wondering what would be the best approach to solve this issue.
Here are two JSON files, called facilities.JSON
{
"data": [
{
"name": "Ipswich",
"id": 52,
"tags": [
{
"id": 156,
"name": "Studio"
}
]
},
{
"name": "Colchester",
"id": 84,
"tags": [
{
"id": 540,
"name": "Swimming"
},
{
"id": 854,
"name": "Gym"
}
]
},
{
"name": "Chelmsford",
"id": 103,
"tags": [
{
"id": 12,
"name": "Spin"
},
{
"id": 432,
"name": "Yoga"
},
{
"id": 854,
"name": "Gym"
}
]
}
]
}
and activities.JSON
{
"data": [
{
"id": 1,
"name": "Diving",
"start_time": "9:00",
"end_time": "10:00",
"level": "Experienced",
"location": "Swimming pool 2",
"facility_id": 84,
"tags": [
{
"id": 540,
"name": "Swimming"
}
]
},
{
"id": 2,
"name": "Swimming",
"start_time": "9:30",
"end_time": "11:30",
"level": "Beginner",
"location": "Swimming pool 1",
"facility_id": 84,
"tags": [
{
"id": 540,
"name": "Swimming"
}
]
},
{
"id": 3,
"name": "Bodypump",
"start_time": "9:30",
"end_time": "10:30",
"level": "Experienced",
"location": "Gym",
"facility_id": 84,
"tags": [
{
"id": 854,
"name": "Gym"
},
{
"id": 65,
"name": "Bodypump"
}
]
},
{
"id": 4,
"name": "Strength & Conditioning",
"start_time": "9:00",
"end_time": "10:00",
"level": "Experienced",
"location": "Gym",
"facility_id": 84,
"tags": [
{
"id": 854,
"name": "Gym"
}
]
},
{
"id": 5,
"name": "Yoga",
"start_time": "10:00",
"end_time": "11:00",
"level": "Beginner",
"location": "Studio 1",
"facility_id": 103,
"tags": [
{
"id": 156,
"name": "Studio"
}
]
},
{
"id": 6,
"name": "Spin",
"start_time": "10:30",
"end_time": "12:00",
"level": "Beginner",
"location": "Studio 2",
"facility_id": 103,
"tags": [
{
"id": 156,
"name": "Studio"
},
{
"id": 12,
"name": "Spin"
}
]
},
{
"id": 7,
"name": "Yoga",
"start_time": "9:30",
"end_time": "10:40",
"level": "Experienced",
"location": "Studio 1",
"facility_id": 103,
"tags": [
{
"id": 156,
"name": "Studio"
}
]
},
{
"id": 8,
"name": "Spin",
"start_time": "9:30",
"end_time": "10:30",
"level": "Experienced",
"location": "Studio 2",
"facility_id": 103,
"tags": [
{
"id": 156,
"name": "Studio"
},
{
"id": 12,
"name": "Spin"
}
]
},
{
"id": 9,
"name": "Pilates",
"start_time": "9:00",
"end_time": "10:00",
"level": "Beginner",
"location": "Studio A",
"facility_id": 52,
"tags": [
{
"id": 156,
"name": "Studio"
}
]
},
{
"id": 10,
"name": "HIIT",
"start_time": "9:30",
"end_time": "10:30",
"level": "Intermediate",
"location": "Studio B",
"facility_id": 52,
"tags": [
{
"id": 156,
"name": "Studio"
},
{
"id": 174,
"name": "Interval training"
}
]
},
{
"id": 11,
"name": "Yoga",
"start_time": "10:30",
"end_time": "10:30",
"level": "Experienced",
"location": "Studio A",
"facility_id": 52,
"tags": [
{
"id": 156,
"name": "Studio"
}
]
}
]
}
Here is what I have to do:
display the facilities' locations
upon selecting a facility, display todays timetable of activities
Here is what I got so far (I am using react-router-dom and styled-components). This is the App.js file
function App() {
return (
<Router>
<div>
<Routes>
<Route exact path="/" element={<Home />} />
<Route exact path="/activities" element={<Activities />} />
</Routes>
</div>
</Router>
);
}
here is the Home.js file
const Home = () => {
let locations = structuredClone(facilities.data);
return(
<Container>
<Services facilitiesData={locations} />
</Container>
)
};
Here is my Services.js file:
const Services = ({ facilitiesData }) => {
const [query, setQuery] = useState('')
const options = {
keys: [
"name",
],
includeScore: true
};
const fuse = new Fuse(facilitiesData, options);
const results = fuse.search(query);
const facilitiesResult = query ? results.map(results => results.item) : facilitiesData;
return(
<Container>
<Heading>Facilities</Heading>
<FuzzySearchBar query={query} setQuery={setQuery} />
<Facilities facilitiesResult={facilitiesResult} />
</Container>
)
}
Facilities.js:
const Facilities = ({ facilitiesResult }) => {
let activitiesData = structuredClone(activities.data)
return(
<Container>
{facilitiesResult
.slice(0, 6)
.sort((a, b) => a.name.localeCompare(b.name))
.map((facility, value) => (
<FacilitiesCard key={value}>
<Heading>{facility.name.replaceAll('_', ' ')}</Heading>
<Link
to={`/activities/:${activitiesData.facility_id}`}
key={activitiesData.facility_id}
>
<p>View</p>
</Link>
</FacilitiesCard>
))}
</Container>
)
}
and Activities.js:
const Activities = () => {
// const [data, setData] = useState([]);
let activitiesData = structuredClone(activities.data);
let facilitiesData = structuredClone(facilities.data)
// const map = new Map();
// facilitiesData.forEach(item => map.set(item.id, item));
// activitiesData.forEach(item => map.set(item.facility_id, {...map.get(item.facility_id), ...item}));
// const mergedArr = Array.from(map.values());
// console.log(mergedArr);
// create a function that compares two data sets
// match the facilities "id" with activities "facility_id"
// connect the "id's" to the Link in Facilities.js
// some example might be find. forEach. filter. that can connect two data sets
// think of joining the datasets in parent component
return(
<div>
{activitiesData.map((activity) => {
if(facilitiesData.id === activities.facility_id)
<div key={activity.facility_id}>
<h1>{activity.name}</h1>
<p>{activity.start_time}</p>
</div>
})}
</div>
)
};
Now, I'm not sure how to connect these two data sets with "id" and "facility_id" which should match.
At first, I was thinking to join the two datasets before rendering the data, and after failed attempts to do so, I thought there might be a way to do this using react-router-dom hooks and utilities. Just thinking that joining the two datasets might not be the most efficient solution.
I would appreciate any input on this matter, even if its a reminder of what I'm doing wrong or how would you approach this problem.
Thank you all and have a great weekend.

You could extract query param that you pass from Link using useParams() hook in Activities.js file and then use that id to filter out the activities that has that facility id associated with it and then map on those activities.

Nested grouping with mongoose

I'm trying to implement a nested group query in mongodb and I'm getting stuck. How to group data by date and campaign_id here ? Each campaign_id should contain a nested array of creatives with data (views and clicks) for each creative.
The data looks like this:
Data:
[
{
"_id": ObjectId("61e3b88d3f14fb87161651c7"),
"campaign_id": 41,
"creative_id": 143,
"date": ISODate("2022-01-16T00:00:00Z"),
"views": 1
},
{
"_id": ObjectId("61e3b8cd3f14fb87161651ef"),
"campaign_id": 41,
"creative_id": 143,
"date": ISODate("2022-01-16T00:00:00Z"),
"views": 7070,
"clicks": 241
},
{
"_id": ObjectId("61e3b8cd3f14fb87161651f2"),
"campaign_id": 41,
"creative_id": 144,
"date": ISODate("2022-01-16T00:00:00Z"),
"views": 3474,
"clicks": 52
},
{
"_id": ObjectId("61e3b8cd3f14fb87161651f4"),
"campaign_id": 41,
"creative_id": 146,
"date": ISODate("2022-01-16T00:00:00Z"),
"views": 3595,
"clicks": 52
},
{
"_id": ObjectId("61e3b8cd3f14fb87161651f6"),
"campaign_id": 41,
"creative_id": 145,
"date": ISODate("2022-01-16T00:00:00Z"),
"views": 3561,
"clicks": 227
},
{
"_id": ObjectId("61e4b18a3f14fb871616d8b0"),
"campaign_id": 41,
"creative_id": 143,
"date": ISODate("2022-01-17T00:00:00Z"),
"views": 9528,
"clicks": 104
},
{
"_id": ObjectId("61e4b18a3f14fb871616d8b2"),
"campaign_id": 41,
"creative_id": 145,
"date": ISODate("2022-01-17T00:00:00Z"),
"views": 4699,
"clicks": 100
},
{
"_id": ObjectId("61e4b18a3f14fb871616d8b5"),
"campaign_id": 41,
"creative_id": 146,
"date": ISODate("2022-01-17T00:00:00Z"),
"views": 4759,
"clicks": 36
},
{
"_id": ObjectId("61e4b18e3f14fb871616d8ca"),
"campaign_id": 41,
"creative_id": 144,
"date": ISODate("2022-01-17T00:00:00Z"),
"views": 4822,
"clicks": 27
}
]
This is the expected result after grouping:
Expected result:
{
"_id": {
"campaign": 955,
"date": ISODate("2022-01-16T00:00:00Z")
},
"creative": [
143: {clicks: XXXX, views:XXXX}
146: {clicks: XXXX, views:XXXX},
142: {clicks: XXXX, views:XXXX},
...
]
},
https://mongoplayground.net/p/oZNxQNb250R

You can do something like this:
db.collection.aggregate([
{
"$sort": {
"date": 1
}
},
{
"$group": {
"_id": {
date: "$date",
campaign: "$campaign_id",
creative_id: "$creative_id"
},
views: {
$sum: "$views"
},
clicks: {
$sum: "$clicks"
}
}
},
{
"$group": {
"_id": {
date: "$_id.date",
campaign: "$_id.campaign"
},
data: {
$push: {
k: {
"$toString": "$_id.creative_id"
},
v: {
views: "$views",
clicks: "$clicks"
}
}
}
}
},
{
$project: {
_id: 1,
creative: {
"$arrayToObject": "$data"
}
}
}
])
Mongo Playground
Notice I added an additional $group stage, this is done to group by creative_id and sum all it's views and clicks. if this stage is redundant you can just eliminate this stage however it works either way.

Lodash: how to group using multiple nested properties?

Trying to group my array using 2 nested properties of object. Below is the data I'm working with.
I need to group this data using start and end properties which are nested in time object here
`
[{
"id": 227,
"day": 0,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}, {
"id": 228,
"day": 1,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}, {
"id": 229,
"day": 2,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}, {
"id": 230,
"day": 3,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}, {
"id": 231,
"day": 4,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}, {
"id": 232,
"day": 5,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}, {
"id": 233,
"day": 6,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}, {
"id": 283,
"day": 0,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}, {
"id": 284,
"day": 1,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}, {
"id": 285,
"day": 2,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}, {
"id": 286,
"day": 3,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}, {
"id": 287,
"day": 4,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}, {
"id": 288,
"day": 5,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}, {
"id": 289,
"day": 6,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}]
`
Currently I can group using one property using code below but not both:
var result = _.groupBy(this.slots, 'time.start')
Expected data could look like below:
`
03: 00: 00 - 06: 00: 00: [{
"id": 227,
"day": 0,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
},
{
"id": 228,
"day": 1,
"time": {
"id": 31,
"start": "03:00:00",
"end": "06:00:00"
},
"max_tasks": 3
}
]
06: 00: 00 - 08: 00: 00: [{
"id": 283,
"day": 0,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
},
{
"id": 284,
"day": 1,
"time": {
"id": 39,
"start": "06:00:00",
"end": "08:00:00"
},
"max_tasks": 3
}
]
`
Thanks in advance :)

You can use the function reduce for grouping by those values.
let arr = [{ "id": 227, "day": 0, "time": { "id": 31, "start": "03:00:00", "end": "06:00:00" }, "max_tasks": 3}, { "id": 228, "day": 1, "time": { "id": 31, "start": "03:00:00", "end": "06:00:00" }, "max_tasks": 3}, { "id": 229, "day": 2, "time": { "id": 31, "start": "03:00:00", "end": "06:00:00" }, "max_tasks": 3}, { "id": 230, "day": 3, "time": { "id": 31, "start": "03:00:00", "end": "06:00:00" }, "max_tasks": 3}, { "id": 231, "day": 4, "time": { "id": 31, "start": "03:00:00", "end": "06:00:00" }, "max_tasks": 3}, { "id": 232, "day": 5, "time": { "id": 31, "start": "03:00:00", "end": "06:00:00" }, "max_tasks": 3}, { "id": 233, "day": 6, "time": { "id": 31, "start": "03:00:00", "end": "06:00:00" }, "max_tasks": 3}, { "id": 283, "day": 0, "time": { "id": 39, "start": "06:00:00", "end": "08:00:00" }, "max_tasks": 3}, { "id": 284, "day": 1, "time": { "id": 39, "start": "06:00:00", "end": "08:00:00" }, "max_tasks": 3}, { "id": 285, "day": 2, "time": { "id": 39, "start": "06:00:00", "end": "08:00:00" }, "max_tasks": 3}, { "id": 286, "day": 3, "time": { "id": 39, "start": "06:00:00", "end": "08:00:00" }, "max_tasks": 3}, { "id": 287, "day": 4, "time": { "id": 39, "start": "06:00:00", "end": "08:00:00" }, "max_tasks": 3}, { "id": 288, "day": 5, "time": { "id": 39, "start": "06:00:00", "end": "08:00:00" }, "max_tasks": 3}, { "id": 289, "day": 6, "time": { "id": 39, "start": "06:00:00", "end": "08:00:00" }, "max_tasks": 3}]
let result = arr.reduce((a, c) => {
let key = `${c.time.start} - ${c.time.end}`;
(a[key] || (a[key] = [])).push(c);
return a;
}, {});
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Use _.groupBy() with a callback, and generate the key from start and end:
const data = [{"id":227,"day":0,"time":{"id":31,"start":"03:00:00","end":"06:00:00"},"max_tasks":3},{"id":228,"day":1,"time":{"id":31,"start":"03:00:00","end":"06:00:00"},"max_tasks":3},{"id":229,"day":2,"time":{"id":31,"start":"03:00:00","end":"06:00:00"},"max_tasks":3},{"id":230,"day":3,"time":{"id":31,"start":"03:00:00","end":"06:00:00"},"max_tasks":3},{"id":231,"day":4,"time":{"id":31,"start":"03:00:00","end":"06:00:00"},"max_tasks":3},{"id":232,"day":5,"time":{"id":31,"start":"03:00:00","end":"06:00:00"},"max_tasks":3},{"id":233,"day":6,"time":{"id":31,"start":"03:00:00","end":"06:00:00"},"max_tasks":3},{"id":283,"day":0,"time":{"id":39,"start":"06:00:00","end":"08:00:00"},"max_tasks":3},{"id":284,"day":1,"time":{"id":39,"start":"06:00:00","end":"08:00:00"},"max_tasks":3},{"id":285,"day":2,"time":{"id":39,"start":"06:00:00","end":"08:00:00"},"max_tasks":3},{"id":286,"day":3,"time":{"id":39,"start":"06:00:00","end":"08:00:00"},"max_tasks":3},{"id":287,"day":4,"time":{"id":39,"start":"06:00:00","end":"08:00:00"},"max_tasks":3},{"id":288,"day":5,"time":{"id":39,"start":"06:00:00","end":"08:00:00"},"max_tasks":3},{"id":289,"day":6,"time":{"id":39,"start":"06:00:00","end":"08:00:00"},"max_tasks":3}]
const result = _.groupBy(data, ({ time: { start, end } }) => `${start} - ${end}`)
console.log(result)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>

Replace some objects and arrays using javascript?

I am using nodejs as server side, i got some of the json objects
This is my json array with objects
[
{
"id": 20,
"gsm": "123456789",
"firstName": "Mohamed",
"lastName": "Sameer",
"contactgroups": [
{
"contactId": 20,
"groupId": 14,
"group": {
"groupname": "Angular"
}
}
]
},
{
"id": 21,
"gsm": "987654321",
"firstName": "Ganesh",
"lastName": "Pandiyan",
"contactgroups": [
{
"contactId": 21,
"groupId": 14,
"group": {
"groupname": "Angular"
}
},
{
"contactId": 21,
"groupId": 15,
"group": {
"groupname": "React"
}
}
]
}
]
I want final output like this(See my groupname key):
[
{
"id": 20,
"gsm": "123456789",
"firstName": "Mohamed",
"lastName": "Sameer",
"contactgroups": [
{
"contactId": 20,
"groupId": 14,
"groupname": "Angular",
"group": {}
}
]
},
{
"id": 21,
"gsm": "987654321",
"firstName": "Ganesh",
"lastName": "Pandiyan",
"contactgroups": [
{
"contactId": 21,
"groupId": 14,
"groupname": "Angular",
"group": {}
},
{
"contactId": 21,
"groupId": 15,
"groupname": "React",
"group": {}
}
]
}
]
is it possible? to do, which is best map or reduce or lodash? any method?
I want to change the place of groupname and to remove the groupname from group object.

You can use array#map. This will return a new array with modified keys & values
var orgArray = [{
"id": 20,
"gsm": "123456789",
"firstName": "Mohamed",
"lastName": "Sameer",
"contactgroups": [{
"contactId": 20,
"groupId": 14,
"group": {
"groupname": "Angular"
}
}]
},
{
"id": 21,
"gsm": "987654321",
"firstName": "Ganesh",
"lastName": "Pandiyan",
"contactgroups": [{
"contactId": 21,
"groupId": 14,
"group": {
"groupname": "Angular"
}
},
{
"contactId": 21,
"groupId": 15,
"group": {
"groupname": "React"
}
}
]
}
]
var newArray = orgArray.map(function(item) {
return {
"id": item.id,
"gsm": item.gsm,
"firstName": item.firstName,
"lastName": item.lastName,
// an IIFE which will create the new contactgroups
"contactgroups": (function() {
return item.contactgroups.map(function(item2, index) {
return {
"contactId": item2.contactId,
"groupId": item2.groupId,
"groupname": item2.group.groupname,
"group": {}
}
})
}())
}
})
console.log(newArray);