如何使用 JavaScript 以循环方式遍历 NxN 网格？

Question

例如 3x3 网格。

[1][2][3]
[4][5][6]
[ 7 ] [ 8 ] [ 9 ]

我需要循环遍历网格并输出路径所在的每个数字。

3x3 网格的输入是一个多维数组：

input = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
]

对于 3x3 网格，输出应为数组或字符串。

output = [1, 2, 3, 6, 9, 8, 7, 4, 5]

该解决方案还需要扩展到任何 NxN 网格。

我正在寻找这个编程问题的解决方案。我尝试了很多不同的方法来做到这一点，但我似乎做不到。我很想学习如何提高我解决问题的能力以及一些额外的建议。

Answer 1

这是一个使用递归的可能解决方案：

function traverseSpiral(n, level=0) {
  //USE A CURSOR TO TRAVERSE THE OUTERMOST LOOP FOR n
  var x=0;
  var y=0;
  //TOP
  while (x<n) {
    output.push(input[level+y][level+x]);
    x++;
  }
  x--;
  y++;
  //RIGHT
  while (y<n) {
    output.push(input[level+y][level+x]);
    y++;
  }
  y--;
  x--;
  //BOTTOM
  while (x>=0) {
    output.push(input[level+y][level+x]);
    x--;
  }
  x++;
  y--;
  //LEFT
  while (y>0) {
    output.push(input[level+y][level+x]);
    y--;
  }
  y++;
  //WE COMPLETED THE LOOP. NOW WE WE ARE LEFT WITH A GRID OF (N-2)x(N-2)
  n = n - 2;
  if (n>1) {
    //TRAVERSE THE NEXT LEVEL INNER LOOP
    return traverseSpiral(n,level+1);
  } else if (n==1) {
    //IF N=1 THEN THERE IS ONE SPACE LEFT. JUST GET THAT LAST SPACE AND WE'RE DONE.
    output.push(input[y][x+1]);
    return output;
  } else {
    //IF N=0 THEN WE ARE DONE.
    return output;
  }
}

工作样本：

4x4 https://jsfiddle.net/mspinks/4gaskn8o/19/

3x3 https://jsfiddle.net/mspinks/4gaskn8o/21/

注意：这适用于指定的 NxN。它不适用于 NxM.

Answer 2

Here is the fiddle code

查看模式。

如果你到达数组的限制或到前一个位置，那么你必须 decrease/increase 列变量或行变量。

The pattern for cyclic looping is

increase column variable ( j )

increase row variable ( i )

decrease column variable ( j )

decrease row variable ( i )

increase column variable ( j )

increase row variable ( i ) .... ....

这是我的代码

//input array
var input = [[1,2,3,4],[5,6,7,8],[9,10,11,12],[13,14,15,16]]

//get the no of rows
var noOfRows = input.length

//get the no of cols
var noOfCols = input[0].length

//initialize i and j to 0
var i =0, j = 0;

//first we go by increasing var j
var status = "increasingJ";

//output array initalize to empty array
var output = []

//till output is no equal to 9, loop through
while(output.length != noOfCols * noOfRows ){

    if(status == "increasingI"){
        
        if( input[i] == undefined || input[i][j] == null){
            i--;
            j--;
            status = "decreasingJ";     
        }else{
            output.push(input[i][j]);
            input[i][j] = null;
            i++;
        }
    }
    if(status == "increasingJ"){
        if( input[j] == undefined || input[i][j] == null){
        
            j--;
            i++;
            status = "increasingI";     
        }else{
            output.push(input[i][j]);
            input[i][j] = null;
            j++;
        }
    }
    if(status == "decreasingI"){
        if( input[i] == undefined || input[i][j] == null){
            i++;
            j++;
            status = "increasingJ";         
        }else{
            output.push(input[i][j]);
            input[i][j] = null;
            i--;
        }
    }
    if(status == "decreasingJ"){
        if( input[j] == undefined || input[i][j] == null){
            j++;
            i--;    
            status = "decreasingI";         
        }else{
            output.push(input[i][j]);
            input[i][j] = null;
            j--;
        }
    }
}

如何使用 JavaScript 以循环方式遍历 NxN 网格？

How can I traverse a NxN grid in a cyclical manner using JavaScript?

javascript

ecmascript-5