How to join JS objects inside an array? Onliner - javascript

What ONELINER could I use to join ANY number of objects inside of an array? The repeated values should be placed inside a nested array, like so:
I have this input:
[
{a: 123},
{b: "abc", c: 455},
{d: null, c: 01, b: {}}
]
I should get this result:
{
a: 123,
b: ["abc", {}],
c: [455, 01],
d: null
}
I have tried this, but no results :(
my_array.map(function(x) {
var result = {};
for(var i in x) {
result[i] = x[i];
}
return result;
});
Thank you!

You could reduce the array of objects. Inside, loop through keys of the each object. If the accumulator doesn't have the key, add it. If the key already exists, use concat to create an array of values. [].concat(acc[k], v) will handle if acc[k] is an array or a single value.
const input = [
{a: 123},
{b: 2222, c: 455},
{d: null, c: 01}
]
const output = input.reduce((acc, o) => {
Object.entries(o).forEach(([k, v]) => {
if (acc.hasOwnProperty(k))
acc[k] = [].concat(acc[k], v)
else
acc[k] = v
})
return acc
}, {})
console.log(output)
Here's a ES5 version of the above answer:
var input = [
{a: 123},
{b: 2222, c: 455},
{d: null, c: 01}
]
var output = input.reduce(function(acc, o) {
Object.keys(o).forEach(function(k) {
if (acc.hasOwnProperty(k))
acc[k] = [].concat(acc[k], o[k])
else
acc[k] = o[k]
})
return acc
}, {})
console.log(output)

Related

Cumulative sum of specific keys with array output using reduce

Say I have the following array:
let arr = [{a: 1, b: 2}, {a: 2, b: 4}, {a: 8, b: -1}]
I would like to compute the cumulative sum of each key, but I would also like the output to be an array of the same length with the cumulative values at each step. The final result should be:
[{a: 1, b: 2}, {a: 3, b: 6}, {a: 11, b: 5}]
My issue is that I am not able to obtain the array as desired. I only get the final object with this:
let result = arr.reduce((accumulator, element) => {
if(accumulator.length === 0) {
accumulator = element
} else {
for(let i in element){
accumulator[i] = accumulator[i] + element[i]
}
}
return accumulator
}, [])
console.log(result); // {a: 11, b: 5}
What you're after sounds like the scan() higher-order function (borrowing the idea from ramda.js), which allows you to return an accumulated result for each element within your array. The scan method is similar to how the .reduce() method behaves, except that it returns the accumulator for each element. You can build the scan() function yourself like so:
let arr = [{a: 1, b: 2}, {a: 2, b: 4}, {a: 8, b: -1}];
const scan = ([x, ...xs], fn) => xs.reduce((acc, elem) => {
return [...acc, fn(acc.at(-1), elem)];
}, xs.length ? [x] : []);
const res = scan(arr, (x, y) => ({a: x.a+y.a, b: x.b+y.b}));
console.log(res);
You might consider further improvements such as providing an initial value to the scan method (similar to how reduce accepts one). Also, if you need better browser support the .at() method currently has limited browser support, so you may instead consider creating your own at() function:
const at = (arr, idx) => idx >= 0 ? arr[idx] : arr[arr.length + idx];
You can easily achieve the result using reduce as
let arr = [
{ a: 1, b: 2 },
{ a: 2, b: 4 },
{ a: 8, b: -1 },
];
const result = arr.reduce((acc, curr, i) => {
if (i === 0) acc.push(curr);
else {
const last = acc[i - 1];
const newObj = {};
Object.keys(curr).forEach((k) => (newObj[k] = curr[k] + last[k]));
acc.push(newObj);
}
return acc;
}, []);
console.log(result);
Something like this:
const arr = [{a: 1, b: 2}, {a: 2, b: 4}, {a: 8, b: -1}]
const result = arr.reduce((accumulator, element, index) => {
if(accumulator.length === 0) {
accumulator.push(element)
} else {
const sum = {};
for(let i in element) {
sum[i] = element[i] + (accumulator[index - 1][i] || 0)
}
accumulator.push(sum)
}
return accumulator
}, [])
console.log(result);
Another option is keep sum result using a Map, it helps if keys in elements of the array are not always same.
const arr = [{a: 1, b: 2}, {a: 2}, {a: 8, b: -1}];
const map = new Map();
const result = arr.map((element) => {
const sum = {};
for (let i in element) {
sum[i]= element[i] + (map.get(i) || 0);
map.set(i, sum[i]);
}
return sum;
});
console.log(result);
Here is a bit more concise reduce, probably not as readable as a consequence...
array.reduce((y,x,i) => ( i===0 ? y : [...y, {a: x.a + y[i-1].a, b: x.b + y[i-1].b}]),[array[0]])
let array = [{a: 1, b: 2}, {a: 2, b: 4}, {a: 8, b: -1}]
let culm = array.reduce((y,x,i) => ( i===0 ? y : [...y, {a: x.a + y[i-1].a, b: x.b + y[i-1].b}]),[array[0]])
console.log(culm)
Given:
const xs =
[ {a: 1, b: 2}
, {a: 2, b: 4}
, {a: 8, b: -1}];
Define a function sum such as:
const sum = ([head, ...tail]) =>
tail.reduce((x, y) =>
({a: (x.a+y.a), b: (x.b+y.b)}), head);
sum(xs);
//=> {a: 11, b: 5}
Then apply that function in a map on larger slices of xs:
xs.map((_, i, arr) => sum(arr.slice(0, i+1)));
//=> [ {a: 1, b: 2}
//=> , {a: 3, b: 6}
//=> , {a: 11, b: 5}]

Transforming array of objects containing arrays into a unique object lookup with lodash

How would you transform codes into result using lodash ?
const codes = [
{a: 'aa', b: [ 8518 ], c: [ '2146' ]},
{a: 'bb', b: [ 120123 ], c: [ 'D835', 'DD3B' ]},
{a: 'cc', b: [ 168, 532 ], c: [ '00A8' ] }
]
const result = [
{a: 'aa', b:8518, c:'2146'},
{a: 'bb', b:120123, c:'D835'},
{a: 'bb', b:120123, c:'DD3B'},
{a: 'cc', b:168, c:'00A8'},
{a: 'cc', b:532, c:'00A8'}
]
Use nested Array.flatMap() calls (or lodash's _.flatMap()) to iterate the main array, and the b objects , and Array.map() to iterate the c arrays to create an array of objects with all the combinations of b and c values:
const codes = [{ a: 'aa', b: [8518], c: ['2146'] }, { a: 'bb', b: [120123], c: ['D835', 'DD3B'] }, { a: 'cc', b: [168, 532], c: ['00A8'] }]
const result = codes.flatMap(o =>
o.b.flatMap(b =>
o.c.map(c => ({ ...o, b, c }))
)
)
console.log(result)
With plain Javascript you could separate the problem into two task, one for build a cartesian product of an array with a nested structure and another for mapping the part result of the cartesian products.
getCartesian is a recursive function which separates all key/value pairs and build a new cartesian product by iterating the values, if an array with objects call getCartesian again and build new objects.
function getCartesian(object) {
return Object.entries(object).reduce((r, [k, v]) => {
var temp = [];
r.forEach(s =>
(Array.isArray(v) ? v : [v]).forEach(w =>
(w && typeof w === 'object' ? getCartesian(w) : [w]).forEach(x =>
temp.push(Object.assign({}, s, { [k]: x }))
)
)
);
return temp;
}, [{}]);
}
var input = [{ a: 'aa', b: [8518], c: ['2146'] }, { a: 'bb', b: [120123], c: ['D835', 'DD3B'] }, { a: 'cc', b: [168, 532], c: ['00A8'] }],
cartesian = input.flatMap(o => getCartesian(o));
console.log(cartesian);
.as-console-wrapper { max-height: 100% !important; top: 0; }

How to expand single level nested hashes on the fly?

I have an object where a few of the keys are nested single level hashes. In this example only b is nested.
const j = {
a: 'A',
b: {
bb: 'BB',
bbb: 'BBB',
},
c: 'C'
};
Question
What I am looking for is a way to loop over the object and if a key is a nested object, then print its keys instead.
a
bb
bbb
c
Does anyone know how to do that?
You can do this recursively:
function printKeys(obj) {
for (const [key, val] of Object.entries(obj)) {
if (typeof val === "object") {
printKeys(val);
} else {
console.log(key);
}
}
}
If you only have one level of nesting at most, #blex's answer is probably the better one.
You could do it with Object.entries and flatMap:
const j = { a: 'A', b: { bb: 'BB', bbb: 'BBB' }, c: 'C' };
function getOneLevelKeys(obj) {
return Object.entries(obj)
.flatMap(([key, value]) => typeof value === "object" ? Object.keys(value) : key);
}
console.log( getOneLevelKeys(j) );
You can use a recursive flatMap with Object.keys.
const j = {
a: 'A',
b: {
bb: 'BB',
bbb: 'BBB',
},
c: 'C'
};
const getKeys = o => Object.keys(o).flatMap(x => o[x] === Object(o[x])
? getKeys(o[x]) : x);
console.log(getKeys(j));

Access a property on an object from an array of keys

I want to write a helper function to unpack a specific object property from each object in an array of objects. Sometimes this property will be top level, other times it will be nested an arbitrary number of levels. So the crux of this question is: how can I access an object property based on an array of key names of variable length?
I'm hoping for something like:
const func = (arrOfObjects, ...keys) {
return arrOfObjects.map(object => {
return object[keys[0]][keys[1]] ... [keys[N]];
})
}
with example behaviour:
const input = [
{a: b: {c: 10}},
{a: b: {c: 11}},
{a: b: {c: 12}}
]
console.log(func(input, 'a', 'b', 'c'))
// [10, 11, 12]
console.log(func(input, 'a', 'b'))
// [{c: 10}, {c: 11}, {c : 12}]
I feel like there has to be a nice ES6 wizardry solution but as yet haven't found it so any help would be much appreciated!
Cheers,
P
You can get a short and easy solution using Array#reduce
const input = [
{a: { b: {c: 10}}},
{a: { b: {c: 11}}},
{a: { b: {c: 12}}}
]
console.log(func(input, ['a', 'b', 'c']))
// [10, 11, 12]
console.log(func(input, ['a', 'b']))
// [{c: 10}, {c: 11}, {c : 12}]
function func(input, props) {
return input.map(x => exctractByProps(x, props));
}
function exctractByProps(obj, props) {
return props.reduce(
(acc, prop) => typeof acc === 'object' && prop in acc ? acc[prop] : undefined,
obj
)
}
The main logic is to grab all the properties passed in and then try to get the value corresponding to obj[prop[0]][prop[1]][prop[2]]/* ... */[prop[n]]. If the object has an odd shape that doesn't match up with prop (for example, an input of {a: 1}, ['a', 'b'] or {d: {c: 1}}, ['a', 'b']) then the function returns undefined.
Based on the answers you gave me to my questions and your example. It seems as if the order will of the input will always match the objects nesting. So here is my solution:
const func = (arrOfObjects, ...keys) => {
return arrOfObjects.map(object => {
let obj = object, integer = keys.length;
for (let index = 0; index < integer; index++) {
obj = obj[keys[index]];
if(obj === undefined) break;
}
return obj;
});
};
const input = [
{ a: { b: { c: 10 } } },
{ a: { b: { c: 11 } } },
{ a: { b: { c: 12 } } }
];
console.log(func(input, "a", "b", "c"));
// [10, 11, 12]
console.log(func(input, "a", "b"));
// [{c: 10}, {c: 11}, {c : 12}]
Unfortunately there is no such thing as the javascript magic you where expecting.
Note: this code will not work when the order of the keys inside the object are nested at random depth. But for what you are trying to solve, this should work just fine. Also, I tried to preserve your initial code as good as possible
If you supply the accessor like [a, b, c[0], name], you can write a custom function which returns the value if found in a nested Object, otherwise returns undefined
let obj = {
a: 1,
b: 2,
c: {
d: 1,
e: [{
f: 3,
g: [{
z: 45
}]
}]
}
}
function findKeyFromPattern(obj, patternArr) {
let value = obj;
for(let i = 0; i < patternArr.length; i++) {
const arrmatch = patternArr[i].match(/(\w+)\[(\d+)\]/);
if(arrmatch) { // pattern matches and array accessor syntax
value = value[arrmatch[1]];
if(typeof value === 'object' && value !== null) {
value = value[arrmatch[2]];
} else {
return;
}
} else {
if(value[patternArr[i]]) {
value = value[patternArr[i]];
} else {
return;
}
}
}
return value;
}
console.log(findKeyFromPattern(obj, ['c', 'e[0]', 'g']));
console.log(findKeyFromPattern(obj, ['c', 'e[1]', 'g']))

Hot to use reduce to convert a array of objects to a single object

i'm trying to work with reduce or map, but i'm a noob some times.
i'm trying to use this function to return a single array from the objects.
var obj = [{ a: 1 }, { b: 2 }, { c: 3 }];
var result = obj.reduce((obj, item) => [item.key] = item.value);
console.log(result);
but i'm always getting :
Uncaught TypeError: Cannot read property 'Symbol(Symbol.iterator)'
of undefined
I searched a lot, but the examples didn't help me... i think that's something simple, but after 1 hour, i'm nothing getting .
What i want..
[{a: 1}, {b: 2}, {c: 3}] to {a: 1, b: 2, c: 3}
You could use Object.assign and spread syntax ....
var obj = [{ a: 1 }, { b: 2 }, { c: 3 }];
console.log(Object.assign({}, ...obj));
With Array#reduce
var obj = [{ a: 1 }, { b: 2 }, { c: 3 }];
console.log(obj.reduce((r, o) => Object.assign(r, o), {}));
Without Object.assign
var obj = [{ a: 1 }, { b: 2 }, { c: 3 }];
console.log(obj.reduce((r, o) => (Object.entries(o).forEach(([k, v]) => r[k] = v), r), {}));
ES5
var obj = [{ a: 1 }, { b: 2 }, { c: 3 }];
console.log(obj.reduce(function (r, o) {
Object.keys(o).forEach(function (k) {
r[k] = o[k];
});
return r;
}, {}));
If you want to use reduce:
var arr = [{ a: 1 }, { b: 2 }, { c: 3 }];
var result = arr.reduce((obj, item) => Object.assign(obj, item), {});
Check the MDN documentation when in doubt.
you can do it in the following way using reduce
var obj = [{ a: 1 }, { b: 2 }, { c: 3 }];
var result = obj.reduce((obj, item) => {
Object.assign(obj, item)
return obj;
}, {});
console.log(result);

Categories