1

I am stuck at this, where I want to set a combination for the variant object.

the variants data is:

"Variants": [
    {
      "name": "color",
      "variants": [
        {
          "id": "e637bd15-d5e3-486b-aba3-3193cfb621bd",
          "variantName": "red"
        },
        {
          "id": "ee81a10d-5cdb-4e99-bc54-9f729025ff6b",
          "variantName": "yellow"
        }
      ],
      "id": 1
    },
    {
      "name": "size",
      "variants": [
        {
          "id": "7546d9dd-410e-4bd7-99f2-cea7b5fd558b",
          "variantName": "large"
        },
        {
          "id": "e787b3c5-45db-4502-ab1b-dfe1670814fc",
          "variantName": "small"
        }
      ],
      "id": 2
    }
  ],

I want the console to print: red/large, red/small, yellow/large, yellow/small. but instead I get: conslole

the code I wrote is:

 const combinations = () => {
    let result = [];
    let len = data.length;
    let i, j;
    for (i = 0; i < len; i++) {
      let len2 = data[i].variants.length;
      for (j = 0; j < len2 - 1; j++) {
        result.push(
          data[j].variants[i].variantName +
            '/' +
            data[i].variants[j + 1].variantName
        );
      }
    }
    return console.log(result);
  };

where did I go wrong? what I am missing, thx in advance.

saifaljanahi
  • 31
  • 1
  • 7

1 Answers1

3

you can achieve this using flatMap and map.

let data =[{name:"color",variants:[{id:"e637bd15-d5e3-486b-aba3-3193cfb621bd",variantName:"red"},{id:"ee81a10d-5cdb-4e99-bc54-9f729025ff6b",variantName:"yellow"}],id:1},{name:"size",variants:[{id:"7546d9dd-410e-4bd7-99f2-cea7b5fd558b",variantName:"large"},{id:"e787b3c5-45db-4502-ab1b-dfe1670814fc",variantName:"small"}],id:2}]
  
  let a = data[0].variants.flatMap((color) => {
    return data[1].variants.map((size) => `${color.variantName}/${size.variantName}`)
  })
  console.log(a)

If you want the cartesian product when the number of arrays is not explicitly specified can do something like this reference

let data = [
    {
      "name": "color",
      "variants": [
        {
          "id": "e637bd15-d5e3-486b-aba3-3193cfb621bd",
          "variantName": "red"
        },
        {
          "id": "ee81a10d-5cdb-4e99-bc54-9f729025ff6b",
          "variantName": "yellow"
        }
      ],
      "id": 1
    },
    {
      "name": "size",
      "variants": [
        {
          "id": "7546d9dd-410e-4bd7-99f2-cea7b5fd558b",
          "variantName": "large"
        },
        {
          "id": "e787b3c5-45db-4502-ab1b-dfe1670814fc",
          "variantName": "small"
        },
                {
          "id": "e787b3c5-45dssb-4502-ab1b-dfe1670814fc",
          "variantName": "medium"
        }
      ],
      "id": 2
    },
        {
      "name": "weight",
      "variants": [
        {
          "id": "7546d9dd-410e-4bd7-99f2-cea7b5fd558b",
          "variantName": "heavy"
        },
        {
          "id": "e787b3c5-45db-4502-ab1b-dfe1670814fc",
          "variantName": "light"
        }
      ],
      "id": 3
    },
            {
      "name": "material",
      "variants": [
        {
          "id": "7546d9dd-410e-4bdhjh2-cea7b5fd558b",
          "variantName": "plastic"
        },
        {
          "id": "e787b3c5-45db-kkhkab1b-dfe1670814fc",
          "variantName": "wood"
        },
                {
          "id": "e787b3c5-45dbhhab1b-dfe1670814fc",
          "variantName": "cement"
        },
      ],
      "id": 4
    }
  ]
  
  let combined = data.reduce((a,{variants})=>{
    return a.flatMap(x=>variants.map(y=>x.concat(y.variantName)))
},[[]]).map((z) => z.join("/"))
 
 console.log(combined)
cmgchess
  • 7,996
  • 37
  • 44
  • 62
  • Thank u for the answer, but cant I use a loop? what if there is a third variant that could be material or weight, is this configurable? what if the length of nested variants is not the same I mean if there are two colors and three sizes. – saifaljanahi Feb 26 '22 at 17:22
  • 1
    you can use a loop as well. i just hardcoded as [0] and [1] just for the example. but ` what if the length of nested variants is not the same I mean if there are two colors and three sizes` would be handled by this – cmgchess Feb 26 '22 at 17:25
  • 1
    if there is another variant then the no of combination would be n1*n2*n3? – cmgchess Feb 26 '22 at 17:27
  • yes, you're correct! and I am stuck at solving this – saifaljanahi Feb 26 '22 at 17:33
  • 1
    @saifaljanahi i will see. meanwhile have a look https://stackoverflow.com/questions/12303989/cartesian-product-of-multiple-arrays-in-javascript – cmgchess Feb 26 '22 at 17:46
  • 1
    @saifaljanahi i did for the combinations aswell using a reduce. i think looping is hard for this without recursion – cmgchess Feb 26 '22 at 18:26
  • 1
    but recursion will be needed if you want with loops – cmgchess Feb 26 '22 at 19:28
  • https://codeshare.io/X8vW7l here i created an array of variants from the data for simplicity first then i used this solution https://stackoverflow.com/a/29585704/13583510 – cmgchess Feb 26 '22 at 20:00