Maze Generator Javascript에서 캐치되지 않는 유형의 오류

Question

무작위로 미로를 만들려고하는데, 대부분 논리와 코드를 알아 냈습니다. 그러나 미로가 무작위로 생성 될 때마다 동일한 오류가 계속 발생합니다. "Uncaught TypeError : 속성을 읽을 수 없습니다 (번호 삽입) '가 정의되지 않았습니다." 이제는 정의 된 속성 (일명 미로의 내부)에 액세스해야하는 위치로 설정되었으므로 문제가있는 곳을 확인하는 데 문제가 있습니다. 당신의 4 개 방법에서

var canvas = document.getElementById('demo'); 
var ctx = canvas.getContext('2d'); 

var grid = []; 

var MAZE_WIDTH = 25; 
var MAZE_HEIGHT = 25; 
var BLOCK_SIZE = 20; 

var points={ 
    startpoint: { 
     x1: 0, 
     y1: 0 
    }, 
    endpoint:{ 
     x2: 0, 
     y2: 0 
    }, 

    newPoint:{ 
     x3: 0, 
     y3:0 
    }, 

    currentPoint:{ 
     x4:0, 
     y4:0 
} 
} 

var thispoint = []; 
var visited = []; 
var traceback = []; 

var count = 0; 


function drawSquare(x, y, r, g, b){ 
    ctx.fillStyle = "rgb(" + r + "," + g + "," + b + ")" 
    ctx.fillRect(x, y, BLOCK_SIZE-1, BLOCK_SIZE-1) 
} 


for(i = 0; i < MAZE_WIDTH; i++){ 
    grid[i] = []; 
    for(j = 0; j <MAZE_HEIGHT; j++){ 
     grid[i][j] = 1; 
    } 

} 


function drawMaze(){ 
    for(var y = 0; y < MAZE_HEIGHT; y++){ 
     for(var x = 0; x < MAZE_WIDTH; x++){ 
      if(x%2 == 1 && y%2 == 1){ 
       grid[x][y] = 0; 
      } 
      if(x%2 == 0 && y%2 == 0){ 
       grid[x][y] = 1; 
      } 
      if(grid[x][y]==1){ 
       drawSquare(x*BLOCK_SIZE, y*BLOCK_SIZE, 255, 255, 255); 
      } 
      if(grid[x][y] == 0){ 
       drawSquare(x*BLOCK_SIZE, y*BLOCK_SIZE, 0,0,0); 
      } 
    } 


} 
} 

function startPath(){ 
    var done = false; 
    do{ 
    var a={ 
     x: Math.floor(Math.random()*25), 
     y: Math.floor(Math.random()*25) 
     } 
      if(grid[a.x][a.y] == 0){ 
       if(a.x-1 < 1 || a.y-1 < 1 || a.y+1 > 23|| a.x+1 >23) { 
        console.log("begin at " + a.x + "," + a.y); 
        points.startpoint.x1 = a.x; 
        points.startpoint.y1 = a.y; 
        points.currentPoint.x4 = points.startpoint.x1; 
        points.currentPoint.y4 = points.startpoint.y1; 
        visited.push([points.startpoint.x1,points.startpoint.y1]); 
        traceback.push([points.startpoint.x1,points.startpoint.y1]); 
        console.log("push"); 
        done = true; 
       }else if(a.x-1 > 1 && a.y-1 > 1 && a.y+1 < 23 && a.x+1 >23){ 
        done = false; 
       } 
      }else if(grid[a.x][a.y] != 0){ 
      done = false; 
      } 
    }while(!done); 
} 

function buildMaze(){ 
    var done = false; 
    do{ 
     if(count == 3){ 
      count = 0; 
      //go back 
      var tempTraceback = traceback.pop; 
      points.currentPoint.x4 = tempTraceback[0]; 
      points.currentPoint.y4 = tempTraceback[1]; 
      console.log("Temp Trace: " + tempTraceback[0], tempTraceback[1]); 
      if(points.currentPoint.x4 == points.startpoint.x1 && points.currentPoint.y4 == points.startpoint.y1){ 
       done = true; 
      }else if(points.currentPoint.x4 != points.startpoint.x1 || points.currentPoint.y4 != points.startpoint.y1){ 
       fillMaze(); 
     } 
     }else if(count!= 3){ 
      count = 0; 
      fillMaze(); 
      console.log(traceback); 
      console.log(visited); 
     } 

    }while(!done) 

} 





function fillMaze(){ 
    var a = Math.floor((Math.random() * 4)+1); 
    switch(a){ 
     case 1: 
       console.log("left"); 
       left(); 

     break; 

     case 2: 
       console.log("right"); 
       right(); 

     break; 

     case 3: 
      console.log("up"); 
       up(); 

     break; 

     case 4: 
      console.log("down"); 
       down(); 

     break; 
    } 
} 
    function fillSquare(x,y){ 
     drawSquare(x*BLOCK_SIZE, y * BLOCK_SIZE,0,0,0) 
    } 


function left(){ 
    var thiscount = 0; 
    for(var i = 1; i <= 2; i++){ 
    if(points.currentPoint.x4 - i >= 1){ 
     if(grid[points.currentPoint.x4 - i][points.currentPoint.y4] != 2){ 
    visited.push([points.currentPoint.x4 - i,points.currentPoint.y4]); 
    traceback.push([points.currentPoint.x4 - i,points.currentPoint.y4]); 
    grid[points.currentPoint.x4 -i][points.currentPoint.y4] = 2; 
    fillSquare(points.currentPoint.x4-i,points.currentPoint.y4); 
     console.log(points.currentPoint.x4 + "," + points.currentPoint.y4); 
     }else if(grid[points.currentPoint.x4 - i][points.currentPoint.y4] == 2){ 
      thiscount++; 
     } 
    }else if(points.currentPoint.x4 - i < 1){ 
     thiscount++; 
    } 
    } 
    if(thiscount == 2){ 
     thiscount = 1; 
    } 
    points.currentPoint.x4 = points.currentPoint.x4 -2; 
    count = count + thiscount; 
} 

function right(){ 
    var thiscount = 0; 
    for(var i = 1; i <= 2; i++){ 
     if(points.currentPoint.x4 + i <= 23){ 
     if(grid[points.currentPoint.x4 + i][points.currentPoint.y4] != 2){ 
    visited.push([points.currentPoint.x4 + i,points.currentPoint.y4]); 
    traceback.push([points.currentPoint.x4 + i,points.currentPoint.y4]); 
    grid[points.currentPoint.x4 +i][points.currentPoint.y4] = 2; 
     fillSquare(points.currentPoint.x4 +i,points.currentPoint.y4); 
      console.log(points.currentPoint.x4 + "," + points.currentPoint.y4); 
     }else if(grid[points.currentPoint.x4 + i][points.currentPoint.y4] == 2){ 
      thiscount++; 
     } 
     }else if(points.currentPoint.x4 + i > 23){ 
      thiscount++; 
     } 
    } 
    if(thiscount == 2){ 
     thiscount = 1; 
    } 

    points.currentPoint.x4 = points.currentPoint.x4 +2; 
    count = count + thiscount; 
} 

function up(){ 
    var thiscount = 0; 
    for(var i = 1; i <= 2; i++){ 
     if(points.currentPoint.y4 - i >= 1){ 
      if(grid[points.currentPoint.x4][points.currentPoint.y4-i] != 2){ 
       visited.push([points.currentPoint.x4,points.currentPoint.y4-i]); 
       traceback.push([points.currentPoint.x4,points.currentPoint.y4-i]); 
       grid[points.currentPoint.x4][points.currentPoint.y4-i] = 2; 
       fillSquare(points.currentPoint.x4,points.currentPoint.y4-i); 
       console.log(visited); 
       console.log(traceback); 
     }else if(grid[points.currentPoint.x4][points.currentPoint.y4-i] == 2){ 
      thiscount++; 
     } 
      }else if(points.currentPoint.y4 - i < 1){ 
       thiscount++; 
      } 
} 
    if(thiscount == 2){ 
     thiscount = 1; 
    } 

    points.currentPoint.y4 = points.currentPoint.y4-2; 
    count = count + thiscount; 
} 


function down(){ 
    var thiscount = 0; 
    for(var i = 1; i <= 2; i++){ 
     if(points.currentPoint.y4 + i <= 23){ 
     if(grid[points.currentPoint.x4][points.currentPoint.y4 + i] != 2){ 
      visited.push([points.currentPoint.x4,points.currentPoint.y4 +i]); 
    traceback.push([points.currentPoint.x4,points.currentPoint.y4+i]); 
    grid[points.currentPoint.x4][points.currentPoint.y4+i] = 2; 
    fillSquare(points.currentPoint.x4,points.currentPoint.y4+i); 
     }else if(grid[points.currentPoint.x4][points.currentPoint.y4 + i] == 2){ 
      thiscount++; 
     } 
     }else if(points.currentPoint.y4 + i > 23){ 
      thiscount++; 
     } 
    } 
    if(thiscount == 2){ 
     thiscount = 1; 
    } 

    count = count + thiscount; 
     points.currentPoint.y4 = points.currentPoint.y4 + 2; 
} 



drawMaze(); 
startPath(); 
buildMaze(); 

Answer 1

(왼쪽 위로 아래 오른쪽), 오류 던지는이 라인이 : 당신이 points.currentPoint.x4 + i 그 기능이 마이너스가 될 수 있도록하기 때문에

if(grid[points.currentPoint.x4 + i][points.currentPoint.y4] != 2){ 

이것은 (왼쪽/최대) 인덱스가 여전히 양수이고 해당 배열의 인덱스로 존재하는지 확인하지 않고 2를 뺄 때 grid