javascript - Uncaught TypeError while generating a random position for the food in a HTML5 snake game -

i working on making multiplayer snake game in html5 canvas javascript.

the code below function handles random placement of food snake. problem piece of code give me x , y in while(map[x][y]); can not read though generate random number.

this exact error:

    "uncaught typeerror: cannot read property '20' of undefined" 

the '20' random generated number (and grid position of food in 2 dimensional array) , changes every time restart program or refresh webpage. can explain need change in order define x , y , place food?

                   function rand_food(){                         var x, y;                          {                             x = mr() * this.rect_w|0;                             y = mr() * this.rect_h|0;                         }                          while (map[x][y]);       <-- here error                                                                           map[x][y] = 1;                              this.ctx.strokerect(x * 10+1, y * 10+1, 8, 8);                                                           } 

here code snippet defines map.

                this.map = [];                     // map positions                     //*                     (i = 0; < this.rect_w; i++){                         map[i] = [];                 }//*/ 

after trying sean's suggestion code looks this: still gives me same error. other suggestion?

function snakegame(){                                            this.map = [];                      (i = 0; < this.rect_w; i++){                         this.map[i] = [];                                                }                       function rand_food(){                         var x, y;                         console.log("map length: " + this.map.length);                         {                             x = mr() * this.rect_w|0;                             y = mr() * this.rect_h|0;                             console.log("x: " + x);                             console.log("y: " + y);                         }                          while (this.map[x][y]);                                                                                  this.map[x][y] = 1;                              this.ctx.strokerect(x * 10+1, y * 10+1, 8, 8);                        } 

this.map , map not same thing.

if inside object this.map public variable of object, , map local variable.

try this:

this.map = []; // map positions (var = 0; < 10; i++){     this.map[i] = []; } 

and in rand_food function use this.map.

here 2 possible ways can go:

//using public variable function snakegame() {     this.map = [];     // map positions     (var = 0; < 10; i++){         this.map[i] = [];     }      function rand_food() {         // refer this.map here         this.map[0];     } };  // using local variable function snakegame() {     var map = [];     // map positions     (var = 0; < 10; i++){         map[i] = [];     }      function rand_food() {         // refer map here         map[0];     } };