Printing 2d array in javascript

Math solution

Take a closer look at your output:

a.....g.....m.....s.
.b...f.h...l.n...r.t
..c.e...i.k...o.q...
...d.....j.....p....

Note that it can be splitted into similiar repeating blocks:

a.....    g.....    m.....    s.
.b...f    .h...l    .n...r    .t
..c.e.    ..i.k.    ..o.q.    ..
...d..    ...j..    ...p..    ..

The length of this blocks is calculable: every row, except for the first one and the last one, has 2 letters. The total length will be: rows * 2 - 2. Let's call it blockLength. By the way, x * 2 - 2 is always even - it is important.

Now, you can see that in every block the letters are "sinking" in the left half, and arising in the second one. So, if you make some observations and analysis, you will understand that for blockLength == 6 you need to output letters at i:

 row  |  i % blockLength
----------------------------
  0   |         0
  1   |  1, blockLength - 1
  2   |  2, blockLength - 2
  3   |         3

After i exceeds blockLength, it will repeat again and again, until the end of the string. This regularity can be easily converted to a JavaScript loop, if you know its basics.

Lazy solution

Within a loop set values in zig-zag order:

var str = 'abcdefghijklmopqrst';
var rows = 4, letterRows = [], currentRow = 0, direction = 1;

for (var i = 0; i < str.length; i++)
{
    letterRows.push(currentRow);
    currentRow += direction;

    if ((direction === 1 && currentRow == rows - 1) // bottom limit
     || (direction === -1 && currentRow == 0)) // top limit 
    {
       direction = direction * -1; // invert direction                                 
    }
}

Then, within nested loops simply output your letters according to letterRows:

for (var row = 0; row < rows; row++)
{
    for (var i = 0; i < str.length; i++)
    {
        output(letterRows[i] == row ? str[i] : '.'); // output is any possible output in your case
    }
    output('\n');
}