html - Javascript large array hangs -
i've been working on project class , i've completed theoretically has problems not execute fast i'd like. task follows: have 10x10 board make moves on. go up, down, left or right randomly. if move takes off board skip it. until 1,000,000 steps taken or reach top right of board. supposed count max number of steps single tile received , same minimum. have done using 2d array , counts , output takes multiple button clicks output. i'm not sure if memory allocation error related how accessing 2d array keep track of number of steps or not. relatively new javascript don't know if way efficient.
code
<!doctype html> <html> <head> </head> <body> <h1>path game</h1> <!-- starts game --> <button onclick="dogame()">click here start game</button> <p id="maxsteps"></p> <p id="minsteps"></p> <p id="totalsteps"></p> <p id="reachedsteps"></p> <p id="reachedsquare"></p> <p id="reachedboth"></p> <!-- js --> <script> function dogame() { var gameboard = [0,0]; var stepcount = 0; //10x10 array hold step counts (may better way. check later) //cell counter var cells = [ [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0] ]; while(true) { var onemove = math.floor(1+(math.random()*4)); //conditional checks //check if both square , step counts satisfied if(gameboard[0] == 9 && gameboard[1] == 9 && stepcount == 1000000) { document.getelementbyid("reachedboth").innerhtml = "reached 1,000,000 steps , top square"; break; } //reached top right before 1,000,000 steps else if(gameboard[0] == 9 && gameboard[1] == 9) { document.getelementbyid("reachedsquare").innerhtml = "reached top right square"; break; } //reached 1,000,000 steps before top right else if(stepcount == 1000000) { document.getelementbyid("reachedsteps").innerhtml = "reached 1,000,000 steps"; break; } //movement on board var x = gameboard[0]; var y = gameboard[1]; cells[x][y] += 1; //move left if(onemove == 1) { //initialized @ 1 less suitable if(gameboard[0] < 0) { gameboard[0] = 0; //reset } else{ gameboard[0]--;//goes left } } //move right else if(onemove == 2) { //if @ edge, keep there or keeps going on if(gameboard[0] >= 9) { gameboard[0] = 9; //reset } else{ gameboard[0]++;//goes right } } //move else if(onemove == 3) { //if @ edge, keep there or keeps going on if(gameboard[1] >= 9) { gameboard[1] = 9; //reset } else{ gameboard[1]++;//goes } } //move down else if(onemove == 4) { //initialized @ 1 less suitable if(gameboard[1] < 0) { gameboard[1] = 0; //reset } else{ gameboard[1]--;//goes down } } stepcount++; //count steps } var max = 0; var min = infinity; //find max for(var = 0; < cells.length;i++) { for(var j = 0; j < cells[i].length; j++) { if(max < cells[i][j]) { max = cells[i][j]; } } } //find min for(var = 0; < cells.length;i++) { for(var j = 0; j < cells[i].length; j++) { if(min > cells[i][j]) { min = cells[i][j]; } } } //total steps print document.getelementbyid("maxsteps").innerhtml = "max steps were: " + max; document.getelementbyid("minsteps").innerhtml = "min steps were: " + min; document.getelementbyid("totalsteps").innerhtml = "total steps were: " + stepcount; } </script> </body> </html>
this block 1 strikes me particularly inefficient:
if(onemove == 1) { //initialized @ 1 less suitable if(gameboard[0] < 1) { gameboard[0] = 1; //reset } else{ gameboard[0]--;//goes left } } //move right else if(onemove == 2) { //if @ edge, keep there or keeps going on if(gameboard[0] >= 10) { gameboard[0] = 10; //reset } else{ gameboard[0]++;//goes right } } //move else if(onemove == 3) { //if @ edge, keep there or keeps going on if(gameboard[1] >= 10) { gameboard[1] = 10; //reset } else{ gameboard[1]++;//goes } } //move down else if(onemove == 4) { //initialized @ 1 less suitable if(gameboard[1] < 1) { gameboard[1] = 1; //reset } else{ gameboard[1]--;//goes down } } this class, won't offer answer directly, can think of solution instead of incrementing or decrementing gameboard counters directly using random value generated?
for example, if had simple 1-dimension gameboard so:
var gameboard = [0,0,0]; var position = 0, direction = 0; function move() { direction = math.round(math.random()) * 2 - 1; position += direction; } the thing missing account possibility have moved off gameboard. if requirement start marker on other side of board (think pacman), accomplished using modulo operator, in js %:
function move() { direction = math.round(math.random()) * 2 - 1; position += direction; position = (position + 3) % 3; } unfortunately, given requirements, don't see way around if conditions stay on board:
position = position < 0 ? 0 : position; position = position > 2 ? 2 : position; hopefully should going in right direction. above 3 lines of code combined 1 line, though prefer make them bit more readable.
a few more notes:
- storing x , y positions in two-element array called gameboard confusing. call them x , y (as @ end of code).
- though requirements don't call it, try generating game board , performing math instead of 10 elements, game changed n elements changing 1 value in code. it's have smallest set of controls possible.
good luck class!
Comments
Post a Comment