Reduce an array to a specific structure using javascript - javascript

I have an array of the objects
[
{"id":"brand","label":"Brand","value":"value1"},
{"id":"waterproof","label":"Waterproof","value":"value1"},
{"id":"diameter","label":"Diameter","value":""},
{"id":"brand","label":"Brand","value":"value2"},
{"id":"waterproof","label":"Waterproof","value":"value2"},
{"id":"diameter","label":"Diameter","value":""}
]
I need to restructure it to a following structure,
[
["Brand", "value1", "value2"],
["Waterproof", "value1","value2"],
["Diameter","",""]
]
Any ideas on how I could do this using a reduce method.
Best

Try following using Array.reduce and Object.values
let arr = [{"id":"brand","label":"Brand","value":"value1"},{"id":"waterproof","label":"Waterproof","value":"value1"},{"id":"diameter","label":"Diameter","value":""},{"id":"brand","label":"Brand","value":"value2"},{"id":"waterproof","label":"Waterproof","value":"value2"},{"id":"diameter","label":"Diameter","value":""}];
let result = Object.values(arr.reduce((a,c) => {
if(a[c.id]) a[c.id].push(c.value);
else a[c.id] = [c.label, c.value];
return a;
}, {}));
console.log(result);

Yust take a Map and collect all values.
var json = '[{"id":"brand","label":"Brand","value":"value1"},{"id":"waterproof","label":"Waterproof","value":"value1"},{"id":"diameter","label":"Diameter","value":""},{"id":"brand","label":"Brand","value":"value2"},{"id":"waterproof","label":"Waterproof","value":"value2"},{"id":"diameter","label":"Diameter","value":""}]',
result = Array.from(JSON
.parse(json)
.reduce((m, { id, label, value }) => m.set(id, (m.get(id) || [label]).concat(value)), new Map)
.values()
);
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Not the best of code but i think this might be useful for you:
let data = [
{"id":"brand","label":"Brand","value":"value1"},
{"id":"waterproof","label":"Waterproof","value":"value1"},
{"id":"diameter","label":"Diameter","value":""},
{"id":"brand","label":"Brand","value":"value2"},
{"id":"waterproof","label":"Waterproof","value":"value2"},
{"id":"diameter","label":"Diameter","value":""}
]
let reducedData = {}
data.forEach((row)=>{
reducedData[row.id] ? reducedData[row.id].push(row.value) : reducedData[row.id] = [row.label, row.value]
})
let newData = Object.keys(reducedData).map((id)=>{return [...reducedData[id]]})

You can also use a simple combo of Array.prototype.reduce and Object.keys:
const data = [{"id":"brand","label":"Brand","value":"value1"},{"id":"waterproof","label":"Waterproof","value":"value1"},{"id":"diameter","label":"Diameter","value":""},{"id":"brand","label":"Brand","value":"value2"},{"id":"waterproof","label":"Waterproof","value":"value2"},{"id":"diameter","label":"Diameter","value":""}];
const grouped = data.reduce((o, { label, value }) =>
({...o, [label]: [...(o[label] || []), value]}), {});
const result = Object.keys(grouped).map(label => [label, ...grouped[label]]);
console.log(result);

Here I use Set to create a unique list of id's then I map to create a custom array based on those id's. This is done by using find to get the label, and filter to get all the items that are related to the id. I map again on the filter to just return the value of the object.
let items = [
{"id":"brand","label":"Brand","value":"value1"},
{"id":"waterproof","label":"Waterproof","value":"value1"},
{"id":"diameter","label":"Diameter","value":""},
{"id":"brand","label":"Brand","value":"value2"},
{"id":"waterproof","label":"Waterproof","value":"value2"},
{"id":"diameter","label":"Diameter","value":""}
]
let result = [...new Set(items.map(i => i.id))]
.map(id => {
return [
items.find(i => i.id == id).label,
...items.filter(i => i.id == id).map(i => i.value)
]
})
console.log(result)

In case the JSON Array is a very long one from some API
var data = [
{"id":"brand","label":"Brand","value":"value1"},
{"id":"waterproof","label":"Waterproof","value":"value1"},
...... //some JSON array form some API
];
var json = JSON.stringify(data);
result = Array.from(JSON
.parse(json)
.reduce((m, { id, label, value }) => m.set(id, (m.get(id) || [label]).concat(value)), new Map)
.values()
);
console.log(result);

Related

Adding a Json Object after a particular Object in array in javascript

I have an array of objects which looks like
arr = [
{"className":"section", "name":"input"},
{"className":"col", "name":"dropdown"},
{"className":"section", "name":"table"}
]
Now I want to push an object {"fieldName":"new"} after every object which has "className":"section"
So my final output should look like something like this
arr = [
{"className":"section", "name":"input"},
{"fieldName":"new"},
{"className":"col","name":"dropdown"},
{"className":"section", "name":"table"},
{"fieldName":"new"}]
How do I acheive this in Javascript?
Use Array.reduce.
let arr = [{"className":"section", "name":"input"},{"className":"col", "name":"dropdown"},{"className":"section", "name":"table"}];
arr = arr.reduce((acc, item) => {
acc.push(item);
if (item.className === "section") {
acc.push({ fieldName: "new" });
}
return acc;
}, []);
console.log(arr);
try this...
arr.forEach(obj => {
if (obj.className === 'section') {
const index = arr.indexOf(obj)
arr.splice(index, 0,
{"fieldName":"new"} )
}
})

How can I do total count of values accordingly selected feild in array

I have a array of objects, for exemple:
let arr = [
{title:apple,quantity:2},
{title:banana,quantity:3},
{title:apple,quantity:5},
{title:banana,quantity:7}
];
array containe many same objects, and i want recived array with uniqe object :
let result = [
{title:apple,quantity:7},
{title:banana,quantity:10}
]
How can I do this?
You can iterate over your array and filter out all the object with same title. Then use reduce to add all the quantity and return a new object. Code is below,
let newArr = [];
arr.forEach((currentObj) => {
const alreadyExists = newArr.findIndex(item => currentObj.title === item.title) > -1;
if(!alreadyExists) {
const filtered = arr.filter(item => item.title === currentObj.title);
const newObject = filtered.reduce((acc, curr) => { return {...acc, quantity: acc.quantity += curr.quantity}}, {...currentObj, quantity: 0})
newArr.push(newObject);
}
})
console.log(newArr);
This is done on a phone so may have some typos but the gist is there:
const resultObj = arr.reduce((acc,curr) =>{
acc[curr.title] = acc[curr.title]== undefined? curr.quantity: acc[curr.title] + curr.quantity
return acc
},{})
const resultArr = Object.entries(resultObj).map([key,value]=>({title:key,quantity:value}))
You could do that in "one line" using arrow function expressions but it won't be very readable unless you know what's happening inside:
let arr = [
{title: "apple",quantity:2},
{title: "banana",quantity:3},
{title: "apple",quantity:5},
{title: "banana",quantity:7}
];
let newArr = [...arr.reduce((acc, {title, quantity}) =>
(acc.set(title, quantity + acc.get(title) || 0), acc), new Map())
].map(([title, quantity]) => ({title, quantity}));
console.log(newArr);
So basically the first part is the reduce method:
arr.reduce((acc, {title, quantity}) =>
(acc.set(title, quantity + acc.get(title) || 0), acc), new Map())
That will returns a Map object, where each title is a key (e.g. "apple") and the quantity is the value of the key.
At this point you have to convert the Map object into an array again, and you do it using the spread syntax.
After you got an array back, you will have it in the following form:
[["apple", 7], ["banana", 10]]
But that is not what you want yet, not in this form, so you have to convert it using the array's map method:
<array>.map(([title, quantity]) => ({title, quantity}))
To keep it concise it uses the destructuring assignment

How to rename JSON element in Nodejs

I have an API that response JSON data like this-
{
"unitcode":"apple",
"description":"bus",
"color":"red",
"intent":"Name 1"
}
I want to change like this-
{
"Value1":"apple",
"Value2":"bus",
"value3":"red",
"value4":"sale"
}
Presently, I can code to rename single key but i want some code to replace all key in one shot. my code like this-
request(baseurl)
.then( body => {
var unit = JSON.parse(body);
unit.intent = "sales"
unit.value1 = unit.unitcode
delete unit.unitcode;
console.log(unit)
console.log(unit.Value1)
var unit2 = JSON.stringify(unit)
// let code = unit.description;
conv.ask('Sales is 1 million metric tonnes ' + unit2);
})
please help me out on this and please little elaborate also to learn something new. thanks
Create a Map of original key to new key (transformMap). Convert the object to pairs of [key, value] with Object.entries(), iterate with Array.map() and replace the replacement key from the Map (or the original if not found). Convert back to an object with Object.toEntries():
const transformMap = new Map([
['unitcode', 'Value1'],
['description', 'Value2'],
['color', 'Value3'],
['intent', 'Value4']
]);
const transformKeys = obj =>
Object.fromEntries(
Object.entries(obj)
.map(([k, v]) => [transformMap.get(k) || k, v])
);
const obj = {
"unitcode": "apple",
"description": "bus",
"color": "red",
"intent": "Name 1"
};
const result = transformKeys(obj)
console.log(result)
If you know the object structure and it is constant, you could just use destructing like so.
const data = {
"unitcode":"apple",
"description":"bus",
"color":"red",
"intent":"Name 1"
};
// If the object is fixed and the fields are known.
const mapData = ({ unitcode, description, color, intent }) => ({
Value1: unitcode,
Value2: description,
Value3: color,
Value4: intent
});
console.log(JSON.stringify(mapData(data)));
But if the object has an unknown number of properties:
const data = {
"unitcode":"apple",
"description":"bus",
"color":"red",
"intent":"Name 1"
};
// If the object is fixed and the fields are known.
const mapData = (data) => {
return Object.keys(data).reduce((a,v,i) => {
a[`Value${i+1}`] = data[v];
return a;
}, {});
};
console.log(JSON.stringify(mapData(data)));
You can edit the array to have the values you need
let i=0,j=0,unit1={};
let unit = JSON.parse(body);
let unit3=["val1","val2","val3","val4"]
let unit5=Object.values(unit);
for(let key in unit){
unit1[unit3[i++]]=unit5[j++];
}
var unit2 = JSON.stringify(unit1)
console.log('Sales is 1 million metric tonnes \n' + unit2);
//Sales is 1 million metric tonnes
//{"val1":"apple","val2":"bus","val3":"red","val4":"Name 1"}
Well your target is to modify the keys and retain the value
In that context, you can iterate through your data. To dynamically generate keys as Value1, Value2, etc, we will append Value with iteration index which is going to be unique always.
const modifyInput = (input) => {
const modifiedInput = {}
Object.values(input).forEach((item, index) => {
modifiedInput[`Value${index + 1}`] = item
})
return modifiedInput
}
Use this function, pass your input and get your desired result

Object.assign - merging arrays values

I have a function that returns an object like (key is string and value is array of strings):
{"myType1": ["123"]}
I want to merge all the results its returning for example - if I have:
{"myType1": ["123"]}
{"myType2": ["456"]}
{"myType1": ["789"]}
I'd like to get
{"myType1": ["123", "789], "myType2": ["456"]}
I've seen Object.assign however that doesn't merge the values it just replaces with the most recent.
Has anyone got an examples of how I can achieve this?
Any help appreciated.
Thanks.
You can the keys of an object by using Object.keys. Use forEach to loop thru the keys and modify the result object.
var result = {};
function mergeObj(o) {
Object.keys(o).forEach(k=>{
result[k] = ( result[k] || [] ).concat(o[k]);
})
}
mergeObj({"myType1": ["123"]});
mergeObj({"myType2": ["456"]});
mergeObj({"myType1": ["789"]});
console.log(result);
Make a function that adds each property to a result object, and call it with each object you get.
let res = {};
const addObj = obj => {
Object.entries(obj).forEach(([k, v]) => (res[k] = res[k] || []).push(...v));
};
addObj({"myType1": ["123"]});
addObj({"myType2": ["456"]});
addObj({"myType1": ["789"]});
console.log(res);
.as-console-wrapper { max-height: 100% !important; top: auto; }
Here is a one liner with the desired process:
Array.from(new Set([{"myType1": ["123"]}, {"myType2": ["456"]}, {"myType1": ["789"]}].map(item => Object.keys(item)[0]).sort())).map(e => { const entry = {}; entry[e] = items.filter(item => Object.keys(item)[0] === e).map(item => item[e][0]); return entry })
Result:
[ { myType1: [ '123', '789' ] }, { myType2: [ '456' ] } ]
Regards.

How to reduce an array with duplicate value?

I have an array like this
let oldArray=[
{type:16,img:['1']},
{type:16,img:['2']},
{type:16,img:['3']},
{type:17,img:['4']}
]
if the type is the same, i want to concat the value.
The result I want is:
let newArray=[
{type:16,img:['1','2','3']},
{type:17,img:['4']}
]
I tried to used reduce function:
oldArray.reduce((acc,cur,idx,src)=>{
if(cur.type===a[idx+1].type){
cur.img.concat(a[idx+1].img);
acc.push(cur)
} else {
acc.push(a[idx+1])
}
return acc
},[])
It seems that there is an error
Can anyone help? Thanks.
Alternative to Bibberty's solution:flatMap is much clearer than reduce
let newArray = [...new Set(oldArray.map(e => e.type))]
.map(e => {
return {
type: e,
img: (oldArray.filter(i => i.type === e).map(x => x.img)).reduce((acc,cur,idx,src)=>{
let length=src.length
let tep=cur.concat(src[idx+1]);
src[idx+1]=tep
return src[idx=length-1]
},[])
}
});
console.log(newArray);
You can use reduce:
let oldArray = [{type: 16,img: ['1']},{type: 16,img: ['2']},{type: 16,img: ['3']},{type: 17,img: ['4']}];
let newArray = oldArray.reduce((acc, curr) => {
acc.some(({
type
}) => type == curr.type) ? acc.find(({
type
}) => type == curr.type).img.push(curr.img[0]) : acc.push(curr);
return acc;
}, []);
console.log(newArray);
We use a Set and then a map.
The Set is populate with the unique types by using a map to extract.
We wrap in [] to give us an array the we then re map to build our object back.
The map then rebuilds our objects and note the use of filter and map to get the img values from the original host array.
let oldArray=[
{type:16,img:['1']},
{type:16,img:['2']},
{type:16,img:['3']},
{type:17,img:['4']}
]
let newArray = [...new Set(oldArray.map(e => e.type))]
.map(e => {
return {
type: e,
img: oldArray.filter(i => i.type === e).flatMap(x => x.img)
}
});
console.log(newArray);
This solution is not a reduce but return result you are looking for is the same
let oldArray = [
{type:16,img:['1']},
{type:16,img:['2']},
{type:16,img:['3']},
{type:17,img:['4']}
];
const transitoryMap = new Map();
for (const item of oldArray) {
if (!transitoryMap.has(item.type)) {
transitoryMap.set(item.type, [item.img[0]])
} else {
const value = transitoryMap.get(item.type)
value.push(item.img[0])
transitoryMap.set(item.type, value)
}
}
const newArray = [];
for (const item of transitoryMap.keys()) {
newArray.push({type:item,img:transitoryMap.get(item)})
}
console.log(newArray)
Here is an example using reduce. I have added a tracker to keep track of type in the newArray.
let oldArray = [
{type:16,img:['1']},
{type:16,img:['2']},
{type:16,img:['3']},
{type:17,img:['4']}
];
oldArray.reduce((a,c)=>{
let index = a.tracker.indexOf(c.type);
if(index === -1) {
a.tracker.push(c.type);
a.newArray.push({...c, img:[...c.img]});
} else {
a.newArray[index].img.push(...c.img);
}
return a;
},{tracker:[],newArray:[]}).newArray;
You might want to consider breaking up the processing into separate simple steps, for example:
Create a flattened object with the appropriate data.
build a new array with the wanted structure.
This will not only keep your code simple, but will allow you to focus on what your code is actually doing instead of how it is doing the task.
var oldArray=[
{type:16,img:['1']},
{type:16,img:['2']},
{type:16,img:['3']},
{type:17,img:['4']}
]
flattenMyObject = (arr) =>
arr.reduce((accum, current) => {
!!accum[current.type] ? accum[current.type].push(...current.img) : accum[current.type] = current.img;
return accum;
}, {});
buildNewArray = (type) => {
return {type: type, img: flattenedObject[type] }
}
Object
.keys(flattenMyObject(oldArray))
.map(buildNewArray);

Categories

Resources