Transform array of Strings into Object

Question

Given the following values:

const values = ['name1|engine1|color1', 'name2|engine2|color2', 'name3|engine3|color3']

I would like to create an array for the values of the same position, like this:

cars = {
  names: ['name1', 'name2', 'name3'],
  engines: ['engine1', 'engine2', 'engine3'],
  colors: ['color1', 'color2', 'color3'],
  ...other properties
}

I tried to do it this way:

values.reduce((acc, value) => {
  const [name, engine, color] = value.split('|')

  acc.names.push(name)
  acc.engines.push(engine)
  acc.colors.push(color)

  return acc
}, {})

The problem is that acc.name, acc.engine and acc.color don't exist yet, and it gives an error on push. What would be a way to do this cleanly, taking into account that they will have other properties?

Can't you set proper initial value for the reduce? Instead of empty object {}, use { names: [], engines: [], colors: []} instead — zzz
– zzz, Commented Apr 30, 2022 at 23:04
Set them in advance as @zzz recommended if you know them but you can set them conditionally if they don't exist using logical nullish assignment (acc.names ??= []).push(name). This is most useful when the keys aren't known in advance or are derived from the reduced elements. — pilchard
– pilchard, Commented Apr 30, 2022 at 23:07

Dali · Accepted Answer · 2022-04-30 23:12:01Z

3

Case1.

const values = [
  "name1|engine1|color1",
  "name2|engine2|color2",
  "name3|engine3|color3"
];

const cars = {
  names: [],
  engines: [],
  colors: []
};

const result = values.reduce((acc, value) => {
  const [name, engine, color] = value.split("|");

  acc.names.push(name);
  acc.engines.push(engine);
  acc.colors.push(color);

  return acc;
}, cars);

console.log(result);

Case2.

const values = [
  "name1|engine1|color1",
  "name2|engine2|color2",
  "name3|engine3|color3"
];

const result = values.reduce((acc, value) => {
  const [name, engine, color] = value.split("|");

  (acc.names ??= []).push(name);
  (acc.engines ??= []).push(engine);
  (acc.colors ??= []).push(color);

  return acc;
}, {});

console.log(result);

answered Apr 30, 2022 at 23:12

Dali

5671 gold badge4 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

zzz · Accepted Answer · 2022-04-30 23:38:19Z

1

If you have a very long property names, you can also do this:

const values = [
  "name1|engine1|color1",
  "name2|engine2|color2",
  "name3|engine3|color3"
];

const keys = ["names", "engines", "colors", ...];

const results = values.reduce((acc, value) => {
  const segments = value.split("|");
  keys.forEach((key, index) => {
    (acc[key] ??= []).push(segments[index]);
  });
  return acc;
}, {});

console.log(results)

answered Apr 30, 2022 at 23:38

zzz

1,1359 silver badges16 bronze badges

Comments

Scott Sauyet · Accepted Answer · 2022-05-02 12:21:36Z

0

Object.fromEntries makes this easy to do this in a simple map call:

const reconstruct = (names, values) =>
  values .map (v => Object .fromEntries (v .split ('|') .map ((v, i) => ([names[i], v]))))

console .log (reconstruct (
  ['name', 'engine', 'color'], [
  'name1|engine1|color1', 
  'name2|engine2|color2', 
  'name3|engine3|color3'
]))

.as-console-wrapper {max-height: 100% !important; top: 0}

We convert each of our strings into something like [['name', 'name1'], ['engine', 'engine1'], ['color', 'color1']] then call Object.fromEntries on that.

answered May 2, 2022 at 12:21

Scott Sauyet

50.9k5 gold badges57 silver badges111 bronze badges

Collectives™ on Stack Overflow

Transform array of Strings into Object

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related