Nested loop and pairing each array

Viewed 30

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

1 Answers

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>

Related