I have an array of TypeScript objects with shape that is essentially the following:
interface MyObject {
id: string
position: number
}
I am trying to convert this array into a map of id to position that looks like this for a JSON POST down the line:
{
"id1": 1,
"id2": 2,
}
One approach is to use an ES6 Map:
array.reduce((map, obj) => map.set(obj.id, obj.position), new Map())
That works, but converting an ES6 Map to JSON is problematic.
I have tried to accumulate the key-value pairs into a pure object literal, but TypeScript has been hating everything I try, which includes Indexable Types, Object.create({}), and a lot of other ideas.
How can I distill a pure object literal of key value pairs from an array of objects?
I have an array of TypeScript objects with shape that is essentially the following:
interface MyObject {
id: string
position: number
}
I am trying to convert this array into a map of id to position that looks like this for a JSON POST down the line:
{
"id1": 1,
"id2": 2,
}
One approach is to use an ES6 Map:
array.reduce((map, obj) => map.set(obj.id, obj.position), new Map())
That works, but converting an ES6 Map to JSON is problematic.
I have tried to accumulate the key-value pairs into a pure object literal, but TypeScript has been hating everything I try, which includes Indexable Types, Object.create({}), and a lot of other ideas.
How can I distill a pure object literal of key value pairs from an array of objects?
Share Improve this question asked Aug 11, 2019 at 1:49 VidyaVidya 30.3k7 gold badges47 silver badges72 bronze badges 2-
I think writing the numbers as strings might solve your problem, e.g
1-->"1". – Samha' Commented Aug 11, 2019 at 1:52 -
1
Object.create(null)would be the rightMapequivalent. – Ry- ♦ Commented Aug 11, 2019 at 1:58
3 Answers
Reset to default 6If your target environment supports ES2019, you could use Object.fromEntries(), like this:
function arrToObjES2019(arr: MyObject[]) {
return Object.fromEntries(arr.map(({ id, position }) => [id, position]));
}
Or, if not, you can make your own polyfill-like version of Object.fromEntries() using array reduce() on an empty object, like this:
function fromEntries<V>(iterable: Iterable<[string, V]>) {
return [...iterable].reduce((obj, [key, val]) => {
obj[key] = val
return obj
}, {} as {[k: string]: V})
}
and then use it:
function arrToObj(arr: MyObject[]) {
return fromEntries(arr.map(({ id, position }) => [id, position]));
}
Either way should let you do what you want:
const arr: MyObject[] = [
{ id: "id1", position: 1 },
{ id: "id2", position: 2 }
];
console.log(JSON.stringify(arrToObj(arr))); // {"id1":1,"id2":2}
Okay, hope that helps. Good luck!
Link to code
Just do this, it is the simplest way:
let newMap = new Map(array.map(obj => [obj.id, obj.position]));
I'm not sure why reduce wouldn't be the approach here...
array.reduce((acc, val) =>
Object.assign(acc, {[val.id]: val.position}), {});