get array, separate comma separated values and then recreate array

Question

I have the following array:

[
["Polymeric", "Vehicle Graphics (Basic)"],
["Cast", "Vehicle Graphics (Part Wrap), Vehicle Graphics (Full Wrap)"],
["Polymeric", "Vehicle Graphics (Part Wrap)"]
]

You'll notice that the 2nd lines of the array's second value has a value separated by a comma. I want to recreate the array like so.

[
["Polymeric", "Vehicle Graphics (Basic)"],
["Cast", "Vehicle Graphics (Part Wrap)"],
["Cast", "Vehicle Graphics (Full Wrap)"],
["Polymeric", "Vehicle Graphics (Part Wrap)"]
]

Here's what I have so far:

const media = [ 
["Polymeric", "Vehicle Graphics (Basic)"],
["Cast", "Vehicle Graphics (Part Wrap), Vehicle Graphics (Full Wrap)"],
["Polymeric", "Vehicle Graphics (Part Wrap)"]
];

var filteredArray = media.filter(function(r) {return r[1]})

filteredArray.forEach(function(value) {
   var fgh = value.slice(1);
   var cddd = [value.shift()]; // takes first part
   var ttt = fgh.toString()
   var str_array = ttt.split(', ');
      const array3 = cddd.concat(fgh);
     console.log(str_array);
});

I understand I need to use concat, split and then finally push it back but whatever I try I'm not getting the result I need so I need help and now I'm lost?

Some random IT boy · Accepted Answer · 2022-02-25 10:46:18Z

1

If you can ensure your nested arrays will always have two elements then it's quite simple:

const source = [ 
  ["Polymeric", "Vehicle Graphics (Basic)"],
  ["Cast", "Vehicle Graphics (Part Wrap), Vehicle Graphics (Full Wrap)"],
  ["Polymeric", "Vehicle Graphics (Part Wrap)"]
];

// Flat map instructs that 
// the nested arrays we're going to return
// should be spread onto the root one
source.flatMap(([key, value]) => { // [key, value] de-structs the array passed as a parameter
  // Here we're getting an array of all possible values; 
  // if there's no ", " then we get a single element, 
  // otherwise we get the whole collection of values
  const values = value.split(', ') 

  // Now, for each of the individual values we create the key-value pairs
  return values.map(singleValue => [key, singleValue])
})

Yields:

edited Feb 25, 2022 at 10:46

answered Feb 24, 2022 at 23:48

Some random IT boy

8,5653 gold badges29 silver badges63 bronze badges

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

8 Comments

Juan-man Over a year ago

Thank you, that worked great. What if there were 17 elements?

Some random IT boy Over a year ago

The array containing the nested arrays can have an arbitrary length; no problem. But my solution forces that the nested arrays have length 2. Now you can have as many commas as you want and it'll work perfectly but the items need to be ['key', 'value1, value2, value3']. The example given has 3 different values but it still is an array of length 2.

Juan-man Over a year ago

Thank you. I have 17 elements, it's number 17 that has the value I need to match. the code works if I have the value in number 1 but not anywhere else. Do I need to change this line also const fff = values.map(singleValue => [key, singleValue])?

Some random IT boy Over a year ago

Right. In that case you'd need to rewrite source.flatMap(([key, value]) =>... to source.flatMap(fullArray => ... and then process the full array in the same maner as I did for item at index 1

Some random IT boy Over a year ago

I have not forgotten about you. Here's a codepen going over flatMap with some detail codepen.io/NanoSpicer/pen/MWOqWyN

|

Collectives™ on Stack Overflow

get array, separate comma separated values and then recreate array

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related