Iterate over a JavaScript array without using nested for-loops

Question

I've been trying to iterate over a multidimensional array in JavaScript, and print each element in the array. Is there any way to print each element in a multidimensional array without using nested for-loops?

http://jsfiddle.net/mKsDW/

var arr = [[1, 5],[7, 4]];
for(var i in arr){
 alert(i); //this displays "0", then displays "1",
 //instead of printing each element in the array
 //how can I make it print each element in each 2D array instead,
 //without using nested for-loops for each dimension of the array?
}

• Fabrício Matté: For arrays you should use a regular for loop instead of a for...in. And yes, it is possible to do without nested loops, but what's the point? Nested loops are the most readable and throughout solution. Other solutions would simply abstract one level of iteration.
• Anderson Green: @FabrícioMatté it would be very tedious to write nested for-loops for a 10 x 10 x 10 x 10 x 10 array, so I'd need a more concise solution.
• Fabrício Matté: Oh I see. Thought it was about 2D arrays only.

Answer 1

Sounds like the issue is that you may have a nesting of arbitrary depth. In that case, use a recursive function.

function printArray(arr) {
 for (var i = 0; i < arr.length; i++)
 if (Array.isArray(arr[i]))
 printArray(arr[i])
 else
 console.log(arr[i])
}

The Array.isArray will need a shim for older browsers.

if (!Array.isArray)
 Array.isArray = function(o) {
 return !!o && Object.prototype.toString.call(o) === "[object Array]"
 }

• Fabrício Matté: Nice shim, I wonder though whether the truthy value check (!!o) is just a sanity check/optimization or is it actually necessary?
• user1106925: @FabrícioMatté: Yeah, it's not really needed. The toString part is usually the slowest, so if I really want to avoid it, I'd do !!o && typeof o === "object" && ...
• adeneo: I always use the MDN shim, but this one looks ok aswell (as it's basically the same)

Answer 2

If you don't want to use nested loops, you can either flat the array or use a recursive function. Something like:

arr.forEach(function each(item) {
 if (Array.isArray(item))
 item.forEach(each);
 else
 console.log(item)
});

Answer 3

Since more array methods were introduced you can use flat():

const arr = [[1, 5],[7, 4]];
for (const val of arr.flat()) console.log(val);

But flat creates a new array. To avoid that you can use ECMAScript iterator helper methods:

const arr = [[1, 5],[7, 4]];
for (const val of arr.values().flatMap(x => x)) console.log(val);