Transform object data with recursive - javascript

I try to transform data with recursive but I can't, I'm very newbie for recursive please help me
Is it need to do with recursive or not what you guy think,
Please help me
(sorry for my english)
This is my data
const mock = [
{ $: { id: '001' } },
{
$: { id: '002' },
question: [{
$: { id: 'r001' },
prompt: 'some-r001',
choices: [{
question: [
{
$: { id: 'r001-1' },
prompt: 'some-r001-1',
choices: [{
question: [{
$: { id: 'r001-1-1' },
prompt: 'some-r001-1-1',
choices: [""],
}]
}]
},
{
$: { id: 'r001-2' },
prompt: 'some-r001-2',
choices: [""],
},
]
}]
}]
}
]
I want to transform to this
const result = {
'r001': {
prompt: 'some-r001',
next: ['r001-1', 'r001-2'],
},
'r001-1': {
prompt: 'some-r001-1',
next: ['r001-1-1'],
}
'r001-1-1': {
prompt: 'some-r001-1-1',
next: [],
},
'r001-2': {
prompt: 'some-r001-2',
next: [],
},
}

You could flat the array in an object by iterating and getting the parts by a recursive call of the function.
const
getFlat = (array, parent = []) => array.reduce((r, { question, choices, prompt, $: { id } = {} }) => {
if (question) return { ...r, ...getFlat(question, parent) };
if (choices) {
parent.push(id);
var next = [];
return { ...r, [id]: { prompt, next }, ...getFlat(choices, next) };
}
return r;
}, {}),
mock = [{ $: { id: '001' } }, { $: { id: '002' }, question: [{ $: { id: 'r001' }, prompt: 'some-r001', choices: [{ question: [{ $: { id: 'r001-1' }, prompt: 'some-r001-1', choices: [{ question: [{ $: { id: 'r001-1-1' }, prompt: 'some-r001-1-1', choices: [""] }] }] }, { $: { id: 'r001-2' }, prompt: 'some-r001-2', choices: [""] }] }] }] }],
result = getFlat(mock);
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Related

How to get all possible ways of passing the quiz

The quiz is implemented in such a way that questions are displayed depending on the user's choice. I need to implement the testing functionality of the questionnaire. After passing in the console should have the same structure as I have provided below. Now my script produces a slightly different structure, not the same as in the example. Example of my code:
const questions = [
{
id: "1",
question: "q1",
answer_1: {
text: "a1",
next_question: "2",
},
answer_2: {
text: "a2",
next_question: "3",
},
},
{
id: "2",
question: "q2",
answer_1: {
text: "a1/a2",
next_question: "",
},
},
{
id: "3",
question: "q3",
answer_1: {
text: "a1",
next_question: "",
},
answer_2: {
text: "a2",
next_question: "4",
},
},
{
id: "4",
question: "q4",
answer_1: {
text: "a1/a2",
next_question: "",
},
},
];
const newQuestionObj = {};
const getAllPath = (arr) => {
const treeStructure = arr.forEach((item) => {
newQuestionObj[item.id] = {
...item,
children: [
...Object.keys(item)
.filter((k) => k.includes("answer"))
.map((k) => ({ ...item[k] })),
],
};
});
const createBranches = ({ question, children }) =>
children.map(({ text, next_question }) =>
next_question.length === 0
? { [question]: text }
: createBranches(newQuestionObj[next_question]).map((obj) => ({
[question]: text,
...obj,
}))
);
return createBranches(newQuestionObj[arr[0].id]);
};
let result = {
path: {
list: getAllPath(questions),
},
};
console.log(result);
Desired result to get:
{
"paths":{
"list":[
[
{
"q1":"a1"
},
{
"q2":"a1/a2"
}
],
[
{
"q1":"a2"
},
{
"q3":"a1"
}
],
[
{
"q1":"a2"
},
{
"q3":"a2"
},
{
"q4":"a1/a2"
}
]
]
}
}

Modify array to stop object from being nested

I have an example array
const array = [
{ obj: [{ fields: { title: 'titleValue1' } }, { fields: { title: 'titleValue2' } }] },
{ obj: [{ fields: { title: 'titleValue3' } }, { fields: { title: 'titleValue4' } }] },
]
I'm looking to modify the array to:
const modifiedArray = [
{ obj: [{ title: 'titleValue1' }, { title: 'titleValue2' }] },
{ obj: [{ title: 'titleValue3' }, { title: 'titleValue4' }] },
]
So when I loop over the modified array I can call 'obj.title' instead of 'obj.fields.title'
I think this can be achieved using .map. So far I have tried:
const ammendedArray = array.map(item => ({ ...item, title: item.map(e => e.fields) }))
But returning 'item.map is not a function'
Any help with this would be much appreciated.
In your code you are trying to use map for an item in the top level array. Which is like this for the first item,
{ obj: [{ fields: { title: 'titleValue1' } }, { fields: { title: 'titleValue2' } }] }
As you can see item is an object. You can not map through an object. What you can do is map through item.obj
const ammendedArray = array.map(item => ({ ...item, title: item.obj.map(e => e.fields) }))
But it will not solve your problem you will get a wrong array of objects like this,
[
{
obj: [{ fields: { title: 'titleValue1' } }, { fields: { title: 'titleValue2' } }],
title: [{ title: 'titleValue1' }, { title: 'titleValue2' }]
},
...
]
You will have to update the obj key instead. What you need to do is the following,
const array = [
{ obj: [{ fields: { title: 'titleValue1' } }, { fields: { title: 'titleValue2' } }] },
{ obj: [{ fields: { title: 'titleValue3' } }, { fields: { title: 'titleValue4' } }] },
]
const res = array.map((item) => {
return {
obj: item.obj.map(i => {
return i.fields
})
};
});
console.log(res);
I could reach to that like this :)
const array = [
{ obj: [{ fields: { title: 'titleValue1' } }, { fields: { title: 'titleValue2' } }] },
{ obj: [{ fields: { title: 'titleValue3' } }, { fields: { title: 'titleValue4' } }] },
]
// pass a function to map
const map1 = array.map((x)=>{
const filedsArray = [...x.obj]
x.obj = []
filedsArray.forEach((y)=>{
x.obj.push({title:y.fields.title})
})
return x
})
console.log(map1);

I have to map a composed array

I have an array I need to get all the tasks that have the same record Id in an array
workspaces=[{recordId:1,tasks:[{title:'me'},{title:'we'}]},{recordId:2,tasks:[{title:'hi'},{title:'it'}]},{recordId:1,tasks:[{title:'they',{title:'she'}]}]
the final result will be like:[[recordId:1,tasks:[{title:'me'},{title:'we'},{title:'they',{title:'she'}]],[recordId:2,tasks:[{title:'hi'},{title:'it'}]]]
i used groupBy from lodash but i did get a separate arrays anyone have any idea how to implement that.
A possible solution could be a two step approach by
collecting items for a certain group
render the array in the wanted format.
This approach features a Map and uses Array.from for getting the wanted result.
var workspaces = [{ recordId: 1, tasks: [{ title: 'me' }, { title: 'we' }] }, { recordId: 2, tasks: [{ title: 'hi' }, { title: 'it' }] }, { recordId: 1, tasks: [{ title: 'they' }, { title: 'she' }] }],
grouped = Array.from(
workspaces.reduce((m, { recordId, tasks }) =>
m.set(recordId, [...(m.get(recordId) || []), ...tasks]), new Map),
([recordId, tasks]) => ({ recordId, tasks })
);
console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }
Nina Scholz solution is more sophisticated, but harder to read.
You can achieve the same like this:
const workspaces= [
{recordId: 1, tasks: [{title:'me'}, {title:'we'}] },
{recordId: 2, tasks: [{title:'hi'}, {title:'it'}] },
{recordId: 1, tasks: [{title:'they'}, {title:'she'}] }
]
const workspacesById = []
workspaces.forEach(w => {
const idx = workspacesById.findIndex(item => item.recordId === w.recordId)
if (idx > -1) {
workspacesById[idx].tasks = [...workspacesById[idx].tasks, ...w.tasks]
} else {
workspacesById.push(w)
}
})
console.log(workspacesById)
I think this is close to what you want
const arr = [
{ recordId: 1, tasks: [{ title: 'me' }, { title: 'we' }] },
{ recordId: 2, tasks: [{ title: 'hi' }, { title: 'it' }] },
{ recordId: 2, tasks: [{ title: 'f' }, { title: 'e' }] },
{ recordId: 2, tasks: [{ title: 'hi' }, { title: 'it' }] },
];
const result = arr.reduce((result, item) => {
if (result[item.recordId]) {
const prevTasks = result[item.recordId];
result[item.recordId].tasks = prevTasks.concat(item.tasks);
} else {
result[item.recordId] = item.tasks;
}
return result;
}, {});
The result will be
{
"1": [
{
"title": "me"
},
{
"title": "we"
}
],
"2": [
{
"title": "hi"
},
{
"title": "it"
}
]
}
Here is your result
let result = [];
for(let i=0; i<workspaces.length; i++) {
let recordFound = false;
if (result.length > 0) {
for(let j=0; j<result.length ; j++) {
if(workspaces[i].recordId === result[j].recordId) {
result[j].tasks = [...result[j].tasks, ...workspaces[i].tasks];
recordFound = true;
}
}
}
if (!recordFound) {
result.push(workspaces[i]);
}
}
console.log(result); //your expected result

Javascript filtering nested arrays

I'm trying to filter a on a nested array inside an array of objects in an Angular app. Here's a snippet of the component code -
var teams = [
{ name: 'Team1', members: [{ name: 'm1' }, { name: 'm2' }, { name: 'm3' }] },
{ name: 'Team2', members: [{ name: 'm4' }, { name: 'm5' }, { name: 'm6' }] },
{ name: 'Team3', members: [{ name: 'm7' }, { name: 'm8' }, { name: 'm9' }] }
];
What I'm trying to achieve is if I search for m5 for example my result should be -
var teams = [
{ name: 'Team1', members: [] },
{ name: 'Team2', members: [{ name: 'm5' }] },
{ name: 'Team3', members: [] }
];
So I've got teams and filteredTeams properties and in my search function I'm doing -
onSearchChange(event: any): void {
let value = event.target.value;
this.filteredTeams = this.teams.map(t => {
t.members = t.members.filter(d => d.name.toLowerCase().includes(value));
return t;
})
}
Now this does work to some extent however because I'm replacing the members it's destroying the array on each call (if that makes sense). I understand why this is happening but my question is what would be the best way to achieve this filter?
you were very close, the only thing that you did wrong was mutating the source objects in teams
basically you can use spread operator to generate a new entry and then return a whole new array with new values.
const teams = [
{ name: 'Team1', members: [{ name: 'm1' }, { name: 'm2' }, { name: 'm3' }] },
{ name: 'Team2', members: [{ name: 'm4' }, { name: 'm5' }, { name: 'm6' }] },
{ name: 'Team3', members: [{ name: 'm7' }, { name: 'm8' }, { name: 'm9' }] }
];
const value = 'm5';
const result = teams.map(t => {
const members = t.members.filter(d => d.name.toLowerCase().includes(value));
return { ...t, members };
})
console.log(result)
Check this. Instead of hard coded m5 pass your value.
const teams = [
{ name: 'Team1', members: [{ name: 'm1' }, { name: 'm2' }, { name: 'm3' }] },
{ name: 'Team2', members: [{ name: 'm4' }, { name: 'm5' }, { name: 'm6' }] },
{ name: 'Team3', members: [{ name: 'm7' }, { name: 'm8' }, { name: 'm9' }] }
];
const filteredTeams = teams.map(team => ({ name: team.name, members: team.members.filter(member => member.name.includes('m5')) }));
console.log(filteredTeams);
You are mutating the original objects, but you could assing new properties to the result object for mapping instead.
var teams = [{ name: 'Team1', members: [{ name: 'm1' }, { name: 'm2' }, { name: 'm3' }] }, { name: 'Team2', members: [{ name: 'm4' }, { name: 'm5' }, { name: 'm6' }] }, { name: 'Team3', members: [{ name: 'm7' }, { name: 'm8' }, { name: 'm9' }] }],
result = teams.map(o => Object.assign(
{},
o,
{ members: o.members.filter(({ name }) => name === 'm5') }
));
console.log(result);
console.log(teams);
.as-console-wrapper { max-height: 100% !important; top: 0; }
Try to seperate your filter function first:
const filterTeamMembers = (teams, filterArr) => {
const useFilter = filterArr.map(x => x.toLowerCase());
return teams.map(team => ({
...team,
members: team.members.filter(member => useFilter.includes(member.name))
}))
};
// =========== And then:
onSearchChange(event: any): void {
let value = event.target.value;
this.filteredTeams = filterTeamMembers(this.teams, [value]);
}

Setting array keys dynamically based on length

Given an array in this format:
[
[{
name: "name",
value: "My-name"
},
{
name: "qty",
value: "1"
},
{
name: "url",
value: "test.com"
},
{
name: "comment",
value: "my-comment"
}
],
[{
name: "name",
value: "My-name2"
},
{
name: "qty",
value: "3"
},
{
name: "url",
value: "test2.com"
}
],
[{
name: "name",
value: "My-name3"
},
{
name: "qty",
value: "1"
},
{
name: "url",
value: "test3.com"
},
{
name: "comment",
value: "my-comment3"
}
]
]
I'm looking to switch that to:
[
[
{ name: "My-name" },
{ qty: "1" },
{ url: "test.com" },
{ comment: "my-comment", }
],[
{ name: "My-name2" },
{ qty: "3" },
{ url: "test2.com",
],[
{ name: "My-name3", },
{ qty: "1", },
{ url: "test3.com", },
{ comment: "my-comment3", }
]
]
In other words, swapping out the array keys but maintaining the object structure within each array element.
I've tried looping over each element and can swap the keys out using something like:
newArray[iCount][item.name] = item.value;
However I'm then struggling to preserve the object order. Note that the comment field may or may not appear in the object.
With Array.map() function:
var arr = [
[{name:"name",value:"My-name"},{name:"qty",value:"1"},{name:"url",value:"test.com"},{name:"comment",value:"my-comment"}],
[{name:"name",value:"My-name2"},{name:"qty",value:"3"},{name:"url",value:"test2.com"}],
[{name:"name",value:"My-name3"},{name:"qty",value:"1"},{name:"url",value:"test3.com"},{name:"comment",value:"my-comment3"}]
],
result = arr.map(function(a){
return a.map(function(obj){
var o = {};
o[obj.name] = obj.value
return o;
});
});
console.log(result);
Check my moreBetterOutput value. I think will be better.
If you still need a result like your example in the question then you can check output value.
const input = [
[
{
name:"name",
value:"My-name"
},
{
name:"qty",
value:"1"
},
{
name:"url",
value:"test.com"
},
{
name:"comment",
value:"my-comment"
}
],
[
{
name:"name",
value:"My-name2"
},
{
name:"qty",
value:"3"
},
{
name:"url",
value:"test2.com"
}
],
[
{
name:"name",
value:"My-name3"
},
{
name:"qty",
value:"1"
},
{
name:"url",
value:"test3.com"
},
{
name:"comment",
value:"my-comment3"
}
]
]
const output = input.map(arr => arr.map(obj => ({[obj.name]: obj.value})))
const moreBetterOutput = output.map(arr => arr.reduce((acc, item, index) => {
acc[Object.keys(item)[0]] = item[Object.keys(item)[0]];
return acc;
}, {}) )
//console.log(output);
console.log(moreBetterOutput);
Another map function:
const result = array.map( subarray =>
Object.assign(...subarray.map( ({name, value}) => ({ [name] : value }) ))
);

Categories

Resources