Related
I am having difficulties formatting some data. Currently, I receive data in the following structure.
[
{
"q1":"5",
"q2":[
"13",
"12",
],
"q3":"test",
}
]
I essentially need to modify this or even create a new object, that takes the following structure.
[
{
id: 1, //q1
answers: [
{
answer: '5',
},
],
},
{
id: 2, //q2
answers: [
{
answer: '13',
},
{
answer: '12',
},
],
},
{
id: 3, //q3
answers: [
{
answer: 'test',
},
],
},
];
So the id in the above would be obtained by remove the q and getting the number in the first data object. It would then have an answers array that would have an object for each answer.
I have been attempting this but have gotten lost. I don't know if I should use loops, mapping, filters etc. To be honest, the furthest I have got so far is obtaining the keys
var modified = data.map(function(item) {
return Object.keys(item)
})
I have created a JSFiddle where I have been attempting to do this.
Is there any way I can achieve the data I am after?
Many thanks
Please use map function.
const data = {
"q1":"5",
"q2":[
"13",
"12",
],
"q3":"test",
};
const result = Object.keys(data).map(key => {
let item = {id: key.substring(1), answers: []};
if(typeof data[key] === "string")
item.answers.push({answer: data[key]});
else
item.answers = data[key].map(val => ({answer: val}));
return item;
});
console.log(result)
const inputData = [
{
"q1":"5",
"q2":[
"13",
"12",
],
"q3":"test",
}
]
function answerMapper(objVal, id){
return Array.isArray(objVal)
?
{ id, answers: objVal.map(answer => ({ answer }))}
:
{ id, answers: [{answer: objVal }] }
}
function formatObject(obj){
return Object.keys(obj).map((k, i) => answerMapper(obj[k], i+1));
}
const result = inputData.map(obj => formatObject(obj));
// remove flatMap if your inputData has more than one entry
console.log(result.flatMap(x => x));
map over the first element of the data with Object.entries, grab the key and value, create a new answers array and return a new object.
const data = [{
"q1": "5",
"q2": [
"13",
"12",
],
"q3": "test",
}];
const out = Object.entries(data[0]).map(obj => {
const [ key, value ] = obj;
const id = Number(key[1]);
// If the the value is an array
// return a new array of mapped data
// Otherwise return an array containing
// one object
const answers = Array.isArray(value)
? value.map(el => ({ answer: el }))
: [{ answer: value }];
// Return the new object
return { id, answers };
});
console.log(out);
lets create a pure function which accepts the object in the array like so
const processObject = obj => Object.keys(obj).map(id => {
const answer = obj[id];
const answers = Array.isArray(answer) ? answer : [answer]
const answerObjectArray = answers.map(ans => ({
answer: ans
}));
return {
id: +id.substring(1),
answers: answerObjectArray
}
});
const dataArray = [{
"q1": "5",
"q2": [
"13",
"12",
],
"q3": "test",
}];
const output = processObject(dataArray[0]);
console.log(output);
Using lodash or vanilla javascript, I need to convert this json:
{
"results" : [
{
"values" : [
{"label" : "FOO", "value" : "foovalue" },
{"label" : "BAR", "value" : "barvalue1" },
{"label" : "BAR", "value" : "barvalue2" }
]
},
{
"values" : [
{"label" : "FOO", "value" : "foovalue"},
{"label" : "BAR", "value" : "barvalue1"},
{"label" : "BAR", "value" : "barvalue2"}
]
}
]
}
into a new object where the label values become the key and duplicates are made into an array of new objects like this:
[
[{"FOO" : "foovalue", "BAR" : ["barvalue1", "barvalue2"]}],
[{"FOO" : "foovalue", "BAR" : ["barvalue1", "barvalue2"]}]
]
I've tried using _.map but it is overwriting the duplicate values and I need them all in an array.
Here is the closest I've come:
var arr = _.map(results, function(o) {
return _.map(o.values, function(v) {
var obj = {};
obj[t.label] = t.value;
return obj;
});
});
where arr returns an array of the objects like this (with the objects being overwritten and not combined into a single object) [{"FOO" : "foovalue"},{"BAR" : "barvalue2"}] and I'm stuck trying to make them into the above array.
You could map the outer array and reduce the inner array by collecting the values of labels. If more than one collected element use an array.
var results = [{ values: [{ label: "FOO", value: "foovalue" }, { label: "BAR", value: "barvalue1" }, { label: "BAR", value: "barvalue2" }] }, { values: [{ label: "FOO", value: "foovalue" }, { label: "BAR", value: "barvalue1" }, { label: "BAR", value: "barvalue2" }] }],
grouped = results.map(({ values }) => [
values.reduce((o, { label, value }) => {
if (!o[label]) {
o[label] = value;
return o;
}
if (!Array.isArray(o[label])) {
o[label] = [o[label]];
}
o[label].push(value);
return o;
}, {})
]);
console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }
I have the two objects. A and B.
A
{
"beta" : {
"value": null,
"error" : null
},
"hamma" : {
"value": null,
"error" : null
},
"zerta" : {
"value": null,
"error" : null
},
"mozes" : 5
}
B
{
"beta" : 5,
"hamma" : 2
}
How do I can loop through the A keys, compare it with the B object and update the values of the existing keys in the A object via Lodash? Maybe there is exists some nice way? I tried to use "assing, assignWith" but looks like I haven't understood how it works.
The result should looks like that:
{
"beta" : {
"value": 5,
"error" : null
},
"hamma" : {
"value": 2,
"error" : null
},
"zerta" : {
"value": null,
"error" : null
},
"mozes" : 5
}
Thanks for any information.
I have resolved this solution via native js by that way but I want to know how can I do it via Lodash.
export function mapServerModelToStateValues(state, serverModel) {
let updatedState = {};
const serverModelKeyList = Object.keys(serverModel);
Object.keys(state).forEach(stateKey => {
serverModelKeyList.forEach(modelKey => {
if ( modelKey === stateKey ) {
updatedState[ stateKey ] = {
...state[ stateKey ],
value : serverModel[ modelKey ]
}
}
});
});
console.log(updatedState);
}
You can use _.mergeWith lodash method and pass custom function.
var a = {"beta":{"value":null,"error":null},"hamma":{"value":null,"error":null},"zerta":{"value":null,"error":null},"mozes":5}
var b = {"beta":5,"hamma":2, "mozes": 123}
_.mergeWith(a, b, function(aValue, bValue) {
_.isPlainObject(aValue) ? aValue.value = bValue : aValue = bValue
return aValue
})
console.log(a)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
Here's a solution that iterates over the B array and uses set to update the value:
_.each(updates, (value, key) => _.set(data, `${key}.value`, value))
This will do the trick, notice that the result will have all the keys in the same value, error format
const A = {
"beta": {
"value": null,
"error": null
},
"hamma": {
"value": null,
"error": null
},
"zerta": {
"value": null,
"error": null
},
"mozes": 5
}
const B = {
"beta": 5,
"hamma": 2
}
const C = _.mapValues(A, (value, key) => {
return {
...value,
value: B[key] || value.value
}
});
console.log(C)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
Map through the _keys from your second object to update the first object accordingly:
// obj a
const a = {
beta: {
value: null,
error: null
},
hamma: {
value: null,
error: null
},
zerta: {
value: null,
error: null
},
mozes: 5
};
// obj b
const b = {
beta: 5,
hamma: 2
};
// map through the 'obj b' keys and update 'obj a' accordingly
_.keys(b).map(key => {
a[key].value = b[key];
});
// log obj a to the console
console.log(a);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
Update: I would use the solution from #GruffBunny - the idea is similar to this one, but done much more elegantly using lodash.
You can use lodash#merge and lodash#mapValues to achieve this.
var result = _.merge({}, a, _.mapValues(b, value => ({ value })));
var a = {
"beta" : {
"value": null,
"error" : null
},
"hamma" : {
"value": null,
"error" : null
},
"zerta" : {
"value": null,
"error" : null
},
"mozes" : 5
};
var b = {
"beta" : 5,
"hamma" : 2
};
var result = _.merge({}, a, _.mapValues(b, value => ({ value })));
console.log(result);
.as-console-wrapper { min-height: 100%; top: 0; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
What is the Best way to convert,
{
"columns":[
"name",
"color"
],
"values":[
[
"lion",
"yellow"
],
[
"crow",
"black"
]
]
}
into
{
"data":[
{
"name":"lion",
"color":"yellow"
},
{
"name":"crow",
"color":"black"
}
]
}
Rather than loop, Is there any function available ? Can I achieved it through something like extend() ?
You could use Object.assign with spread syntax ... for the parts.
var object = { columns: ["name", "color"], values: [["lion", "yellow"], ["crow", "black"]] },
result = { data: object.values.map(v => Object.assign(...object.columns.map((c, i) => ({[c]: v[i]})))) };
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
You can do do it with combination of map and reduce. Reducing original columns array will allow to code to work with any number of columns, it will pick up corresponding value by index:
const result = {data: data.values.map(el => {
return data.columns.reduce((prev, curr, index) => {
prev[curr] = el[index]
return prev
}, {})
})}
Check the demo below.
const data = {
"columns":[
"name",
"color"
],
"values":[
[
"lion",
"yellow"
],
[
"crow",
"black"
]
]
}
const result = {data: data.values.map(el => {
return data.columns.reduce((prev, curr, index) => {
prev[curr] = el[index]
return prev
}, {})
})}
console.log(result)
You can get vales of .columns array using destructuring assignment, spread element; for..of loop to assign computed properties of .columns array as strings as properties of objects at data array by iterating .values property of original object, assign value of each array as value of created object
let obj = {
"columns":[
"name",
"color"
],
"values":[
[
"lion",
"yellow"
],
[
"crow",
"black"
]
]
}
let [res, key, value] = [{data:Array()}, ...obj.columns];
for (let [a, b] of [...obj.values]) res.data.push({[key]:a, [value]:b});
console.log(res);
I have this kind of array:
var foo = [ { "a" : "1" }, { "b" : "2" }, { "a" : "1" } ];
I'd like to filter it to have:
var bar = [ { "a" : "1" }, { "b" : "2" }];
I tried using _.uniq, but I guess because { "a" : "1" } is not equal to itself, it doesn't work. Is there any way to provide underscore uniq with an overriden equals function?
.uniq/.unique accepts a callback
var list = [{a:1,b:5},{a:1,c:5},{a:2},{a:3},{a:4},{a:3},{a:2}];
var uniqueList = _.uniq(list, function(item, key, a) {
return item.a;
});
// uniqueList = [Object {a=1, b=5}, Object {a=2}, Object {a=3}, Object {a=4}]
Notes:
Callback return value used for comparison
First comparison object with unique return value used as unique
underscorejs.org demonstrates no callback usage
lodash.com shows usage
Another example :
using the callback to extract car makes, colors from a list
If you're looking to remove duplicates based on an id you could do something like this:
var res = [
{id: 1, content: 'heeey'},
{id: 2, content: 'woah'},
{id: 1, content:'foo'},
{id: 1, content: 'heeey'},
];
var uniques = _.map(_.groupBy(res,function(doc){
return doc.id;
}),function(grouped){
return grouped[0];
});
//uniques
//[{id: 1, content: 'heeey'},{id: 2, content: 'woah'}]
Implementation of Shiplu's answer.
var foo = [ { "a" : "1" }, { "b" : "2" }, { "a" : "1" } ];
var x = _.uniq( _.collect( foo, function( x ){
return JSON.stringify( x );
}));
console.log( x ); // returns [ { "a" : "1" }, { "b" : "2" } ]
When I have an attribute id, this is my preffered way in underscore:
var x = [{i:2}, {i:2, x:42}, {i:4}, {i:3}];
_.chain(x).indexBy("i").values().value();
// > [{i:2, x:42}, {i:4}, {i:3}]
Using underscore unique lib following is working for me, I m making list unique on the based of _id then returning String value of _id:
var uniqueEntities = _.uniq(entities, function (item, key, a) {
return item._id.toString();
});
Here is a simple solution, which uses a deep object comparison to check for duplicates (without resorting to converting to JSON, which is inefficient and hacky)
var newArr = _.filter(oldArr, function (element, index) {
// tests if the element has a duplicate in the rest of the array
for(index += 1; index < oldArr.length; index += 1) {
if (_.isEqual(element, oldArr[index])) {
return false;
}
}
return true;
});
It filters out all elements if they have a duplicate later in the array - such that the last duplicate element is kept.
The testing for a duplicate uses _.isEqual which performs an optimised deep comparison between the two objects see the underscore isEqual documentation for more info.
edit: updated to use _.filter which is a cleaner approach
The lodash 4.6.1 docs have this as an example for object key equality:
_.uniqWith(objects, _.isEqual);
https://lodash.com/docs#uniqWith
Try iterator function
For example you can return first element
x = [['a',1],['b',2],['a',1]]
_.uniq(x,false,function(i){
return i[0] //'a','b'
})
=> [['a',1],['b',2]]
here's my solution (coffeescript) :
_.mixin
deepUniq: (coll) ->
result = []
remove_first_el_duplicates = (coll2) ->
rest = _.rest(coll2)
first = _.first(coll2)
result.push first
equalsFirst = (el) -> _.isEqual(el,first)
newColl = _.reject rest, equalsFirst
unless _.isEmpty newColl
remove_first_el_duplicates newColl
remove_first_el_duplicates(coll)
result
example:
_.deepUniq([ {a:1,b:12}, [ 2, 1, 2, 1 ], [ 1, 2, 1, 2 ],[ 2, 1, 2, 1 ], {a:1,b:12} ])
//=> [ { a: 1, b: 12 }, [ 2, 1, 2, 1 ], [ 1, 2, 1, 2 ] ]
with underscore i had to use String() in the iteratee function
function isUniq(item) {
return String(item.user);
}
var myUniqArray = _.uniq(myArray, isUniq);
I wanted to solve this simple solution in a straightforward way of writing, with a little bit of a pain of computational expenses... but isn't it a trivial solution with a minimum variable definition, is it?
function uniq(ArrayObjects){
var out = []
ArrayObjects.map(obj => {
if(_.every(out, outobj => !_.isEqual(obj, outobj))) out.push(obj)
})
return out
}
var foo = [ { "a" : "1" }, { "b" : "2" }, { "a" : "1" } ];
var bar = _.map(_.groupBy(foo, function (f) {
return JSON.stringify(f);
}), function (gr) {
return gr[0];
}
);
Lets break this down. First lets group the array items by their stringified value
var grouped = _.groupBy(foo, function (f) {
return JSON.stringify(f);
});
grouped looks like:
{
'{ "a" : "1" }' = [ { "a" : "1" } { "a" : "1" } ],
'{ "b" : "2" }' = [ { "b" : "2" } ]
}
Then lets grab the first element from each group
var bar = _.map(grouped, function(gr)
return gr[0];
});
bar looks like:
[ { "a" : "1" }, { "b" : "2" } ]
Put it all together:
var foo = [ { "a" : "1" }, { "b" : "2" }, { "a" : "1" } ];
var bar = _.map(_.groupBy(foo, function (f) {
return JSON.stringify(f);
}), function (gr) {
return gr[0];
}
);
You can do it in a shorthand as:
_.uniq(foo, 'a')