Challenge discussion for FreeCodeCamp.com - Nesting For Loops challenge: https://www.freecodecamp.com/challenges/nesting-for-loops

FreeCodeCamp - Nesting For Loops.js

/* FreeCodeCamp - Nesting For Loops Challenge.
                                                              Total: 75 Lines on Gist.
Before we get into the challenge instructions and process,
I'd like to have an extended review for Accessing Complex Arrays &
iterating across arrays using for loops. Then we'll move into the complex arrays.

For this process, let's first create an array:
var arr = ["B", "D", "F", "H", "J", "L"]; // Even letters.
To access "B" we use arr[0]; and "J" is arr[4];

Now if we complicate that and turn "B" or "J" into a nested array.

var nArr = [ ["b1" , "d1"] , ["f2" , "h2"] , ["j3" , "l3"] ];
If we change it up a little and access nArr[1]; we get an array: ["f2" , "h2"]
To access the single element "f2", we first access: nArr[1]; then drill further down to [0].
This will give us: nArr[1][0] for the "f2" value.

Now let's clear that out and do that with something a little more conmplex.
var nestArr = [ ["a1"] , ["b2","c2"] , ["d3","e3","f3"] , ["g4","h4","i4","k4"] ];
I want to access each element and show the pattern:
nestArr[0]; is ["a1"] ... an array containing an element
nestArr[0][0]; is "a1"
nestArr[1]; is ["b2","c2"]
nestArr[1][0]; is "b2"
nestArr[1][1]; is "c2"
nestArr[2]; is ["d3","e3","f3"]
nestArr[2][0]; is "d3"
nestArr[2][1]; is "e3"
nestArr[2][2]; is "f3"
nestArr[3]; is ["g4","h4","i4","k4"]
nestArr[3][0]; is "g4"
nestArr[3][1]; is "h4"
nestArr[3][2]; is "i4"
nestArr[3][3]; is "k4"

If you look this over you start to see a pattern emerge.

Now we can start to create a script to do the manual work for us.
var arr = [["a1"], ["b2","c2"], ["d3","e3","f3"], ["g4","h4","i4","k4"]];
// If we want to console.log all of the elements we need to
// utilize a loop inside of another loop.
for (var i = 0; i < arr.length; i++){ // This uses the length of the parent array
   console.log("The value of arr[" + i + "] is: \t" + arr[i]);
   for (var j = 0; j < arr[i].length; j++) { // This uses the length of the nested array.
      console.log("The value of arr[" + i + "][" + j + "] is: \t\t" + arr[i][j]);
   }
}
*/

// For this lesson we don't really want to console.log() a list of array elements.
// We want to get the array elements and produce a value of the product of all the array elements.


// Instructions
// Modify function multiplyAll so that it multiplies the product variable by each number in the sub-arrays of arr
function multiplyAll(arr) {
  var product = 1;
  // Only change code below this line
  
  // Only change code above this line
  return product;
}

// Modify values below to test your code
multiplyAll([[1,2],[3,4],[5,6,7]]);
// if we look at this array being passed into the function
// [ [1,2] , [3,4] , [5,6,7] ]
/* To help explain the challenge easier:
In mathematics, a product is the result of multiplying, 
or an expression that identifies factors to be multiplied.
We are looking at taking the product of the values in the array:
1 times 1 times 2 times 3 times 4 ...
This code should be modular so that you can use any number of arrays within an array.
The other test tha needs to pass as well is:
[ [5 , 1] , [0.2 , 4 , 0.5] , [3 , 9] ] to return 54

An explanation of how to access elements in an array:

You directly access a value in an array by specifying which index you want:

var myArr = [1, 2, 3]
myArr[0] // this is 1
myArr[1] // this is 2
myArr[2] // this is 3

The values in an array can be anything, including other arrays, so:

var myArr = [[1, 2, 3], [4, 5, 6]]
myArr[0] // this is [1, 2, 3]
myArr[1] // this is [4, 5, 6]

You can access the values in those arrays the same way:

var myArr = [[1, 2, 3], [4, 5, 6]]
myArr[0][0] // array at index 0, value in that array at index 0 - this is 1
myArr[0][1] // array at index 0, value in that array at index 1 - this is 2
myArr[0][2] // array at index 0, value in that array at index 2 - this is 3
myArr[1][0] // array at index 1, value in that array at index 0 - this is 4
myArr[1][1] // array at index 1, value in that array at index 1 - this is 5
myArr[1][2] // array at index 1, value in that array at index 2 - this is 6

You can do this to silly depths:

var myArr = [[[[[[0]]]]]]
myArr[0] // this is [[[[[0]]]]]
myArr[0][0] // this is [[[[0]]]]
myArr[0][0][0] // this is [[[0]]]
myArr[0][0][0][0] // this is [[0]]
myArr[0][0][0][0][0] // this is [0]
myArr[0][0][0][0][0][0] // this is 0