How to create a nested while loop based on N number of arrays?

Question

I'm trying to create a combination of all possible variants of the arrays given below, which are pretty self-explanatory.

let arr1 = ['Small', 'Medium', 'Large', 'Extra-Large']
let arr2 = ['Black','Red','White']
let arr3 = ['Normal','Limited-Edition']

let combos = []

arr1.forEach((i) => {
  arr2.forEach((j) => {
    arr3.forEach((k) => {
      combos.push(i + '-' + j + '-' + k)
    })
  }) 
})

console.log(combos)

This gives the output I want, however I want to create a function that takes an arbitrary array of arrays, [arr1, arr2, arr3.....arrN] and creates a nested loop of each of them, and returns a combined value of strings.

How do I go around creating such a function?

cmgchess · Accepted Answer · 2022-03-13T20:07:00.657

3

You can use something like this using reduce. I referenced this post

let arr1 = ['Small', 'Medium', 'Large', 'Extra-Large'] 
let arr2 = ['Black','Red','White']
let arr3 = ['Normal','Limited-Edition']
let arr4 = ['x','y','z']

let arr = [arr1,arr2,arr3,arr4]

 let combined = arr.reduce((a,c)=>{
    return a.flatMap(x=>c.map(y=>x.concat(y)))
},[[]]).map((z) => z.join("-"))
 
 console.log(combined)
  console.log(combined.length) //4*3*2*3 = 72

UPDATE - This one is taken directly from the top answer with a very small modification

let arr1 = ['Small', 'Medium', 'Large', 'Extra-Large'] 
let arr2 = ['Black','Red','White']
let arr3 = ['Normal','Limited-Edition']
let arr4 = ['x','y','z']

let arr = [arr1,arr2,arr3,arr4]

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

console.log(cartesian(arr))

edited Mar 13 '22 at 20:07

answered Mar 13 '22 at 19:56

cmgchess

7,996
37
44
62

Is this possible in native JS? I'm struggling with creating nested for loops dynamically – user2402616 Aug 10 '23 at 03:04
1

@user2402616 hi im using native js array methods [map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map), [reduce](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce), [flatMap](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flatMap), [join](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join), [concat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat) – cmgchess Aug 10 '23 at 04:21
1

@user2402616 not sure what u meant by native js here. can u elaborate – cmgchess Aug 10 '23 at 04:24
You are right, I had never seen `flatMap` and assumed that was lodash or something. But I mean, wo Array methods. Just raw loops and whatnot (wo using eval) – user2402616 Aug 10 '23 at 17:41
1

@user2402616 flatmap is basically calling map().flat() in order. you will find custom implementations for these higher order functions using loops on stackoverflow – cmgchess Aug 10 '23 at 17:53
This is for an exercise to create 'all permutations of values in arrays'. Doing it as a study. So I don't wanna fully read an answer, but just want to know it's possible – user2402616 Aug 10 '23 at 19:22
1

should be possible. might need some recursion i guess https://stackoverflow.com/a/29585704/13583510 – cmgchess Aug 11 '23 at 03:51
Yup, I've been banging at this for a while and feel like recursion might be only way to do it wo `eval` – user2402616 Aug 11 '23 at 14:17

score 0 · Answer 2 · answered Mar 13 '22 at 20:23

    const arr1 = ['Small', 'Medium', 'Large', 'Extra-Large'] 
    const arr2 = ['Black','Red','White']
    const arr3 = ['Normal','Limited-Edition']
    const arr4 = ['x','y','z']
  
    const arr = [arr1,arr2,arr3,arr4]
    const merged = [].concat.apply([], arr);

    console.log(merged);

How to create a nested while loop based on N number of arrays?

2 Answers2