Nested loop and pairing each array

Question

So I have this puzzle i can't solve, using loop only :

let DataListVariant = [{
    nameVariant:'Color',choiceVariant:choiceVariant1
},{
    nameVariant:'Texture',choiceVariant:choiceVariant2
},{
    nameVariant:'Motive',choiceVariant:choiceVariant3
},{
    nameVariant:'Material',choiceVariant:choiceVariant4
}]

let choiceVariant1 = ['Red','Blue']
let choiceVariant2 = ['Soft','Hard']
let choiceVariant3 = ['Polkadot','Square']
let choiceVariant4 = ['Metalic','Wood']

I have to make it to array like this

array 1  = [Red , Soft , Polkadot , Metalic]
array 2  = [Red , Soft , Polkadot , Wood]
.....
array .. = [Blue , Hard , Square , Wood]

and the list variant has to be dynamic

let DataListVariant = [{
        nameVariant:'Color',choiceVariant:choiceVariant1
    },{
        nameVariant:'Texture',choiceVariant:choiceVariant2
    },{
        nameVariant:'Motive',choiceVariant:choiceVariant3
    },{
        nameVariant:'Material',choiceVariant:choiceVariant4
    },{
        nameVariant:'NEW VARIANT',choiceVariant:choiceVariant5
    }]

and the choice of variant also dynamic

let choiceVariant = [something1,something2,something3,something4, ...]

Help me please I cant solve this for 2 days already and didn't find solution on internet

Please visit the [help], take the [tour] to see what and [ask]. Do some research - [search SO for answers](https://www.google.com/search?q=javascript+convert+object+array+plain+array+site%3Astackoverflow.com). If you get stuck, post a [mcve] of your attempt, noting input and expected output using the [\[<>\]](https://meta.stackoverflow.com/questions/358992/ive-been-told-to-create-a-runnable-example-with-stack-snippets-how-do-i-do) snippet editor. — mplungjan, Sep 08 '22 at 05:59
It is not clear what you mean by the last `and the choice of variant also dynamic` — mplungjan, Sep 08 '22 at 06:05
@mplungjan different problem , if its all possible pair it's easier , even it is dynamic , and I tried to search already none have similar problem — Jzx Naga, Sep 08 '22 at 06:08
it means, its not limited only by 2 ['red','blue'] , let's say I add more like ['red','blue','yellow','purple'] — Jzx Naga, Sep 08 '22 at 06:09

mplungjan · Answer 1 · 2022-09-08T07:02:20.020

Answering before the "using loop only" amendment

If I take Cartesian product of multiple arrays in JavaScript and apply it to your case I get

const cartesian = (...a) => a.reduce((a, b) => a.flatMap(d => b.map(e => [d, e].flat())));

const obj = DataListVariant.reduce((acc,{nameVariant, choiceVariant}) => {
  acc[nameVariant] = choiceVariant;
  return acc;
},{})
console.log(obj);

const arrs = cartesian(...Object.entries(obj).map(([key,val]) => val))
console.log(arrs);

<script>
let choiceVariant1 = ['Red', 'Blue', 'Yellow'];
let choiceVariant2 = ['Soft', 'Hard'];
let choiceVariant3 = ['Polkadot', 'Square'];
let choiceVariant4 = ['Metalic', 'Wood'];
let DataListVariant = [
{ nameVariant: 'Color',     choiceVariant: choiceVariant1 }, 
{ nameVariant: 'Texture',   choiceVariant: choiceVariant2 }, 
{ nameVariant: 'Motive',    choiceVariant: choiceVariant3 }, 
{ nameVariant: 'Material',  choiceVariant: choiceVariant4}]
</script>

thank you, i saw that flatMap solution also but I'm trying to complete it with loop only to solve this puzzle — Jzx Naga, Sep 08 '22 at 06:40
So unroll it using one of the other examples in the same answer or [look for an older cartesian using loops](https://stackoverflow.com/questions/9422386/lazy-cartesian-product-of-arrays-arbitrary-nested-loops) — mplungjan, Sep 08 '22 at 06:48

Nested loop and pairing each array

1 Answers1