StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POgetting undefined at random times
text
Body
copied!<p>i will try to add only relevant code but just in case its needed full page is <a href="http://borisute.com/geshem/2013/mkeller/tetris.html" rel="nofollow">here</a>, and feel free to check it out on <a href="https://github.com/mendelthegeek/my-canvas-tetris" rel="nofollow">github</a> as well.</p> <p>i am building a tetris game using canvas/javascript and part of it </p> <pre><code> //drop the falling piece by one space function dropByOne(){ //loop through the four squares that make up the piece for ( i = 3; i > -1; i-- ) { //empty old spot of piece board[ fallingPiecePos[i].y ][ fallingPiecePos[i].x ] = 0; //drop position place-holder by one row fallingPiecePos[i].y++; //add square to new spot board[ fallingPiecePos[i].y ][ fallingPiecePos[i].x ] = fallingPiece; } } </code></pre> <p><code>board</code> is a 20*10 <code>array</code>, <code>fallingPiecePos</code> is a array of objects with numerical <code>x</code> and <code>y</code> values, i.e. <code>[{y:0,x:4},{y:0,x:5},{y:0,x:6},{y:0,x:7}]</code> (line piece) or <code>[{y:0,x:4},{y:0,x:5},{y:1,x:4},{y:1,x:5}]</code> (square) that are rendered into <code>board</code> with the following code:</p> <pre><code>for ( i = 0; i < 4; i++ ) { board[ fallingPiecePos[i].y ][ fallingPiecePos[i].x ] = fallingPiece; } </code></pre> <p><code>fallingPiece</code> is a randomly assigned number (1-7) used by <code>canvas</code> to render the piece as the right color.</p> <p>hope thats clear enough, now the problem is that whenever <code>fallingPiece</code> has a value it has had before i get </p> <pre><code>TypeError: board[fallingPiecePos[i].y] is undefined [Break On This Error] board[ fallingPiecePos[i].y ][ fallingPiecePos[i].x ] = fallingPiece; </code></pre> <p>(<code>board[ fallingPiecePos[i].y ][ fallingPiecePos[i].x ] = fallingPiece;</code> is the last line of above code-block)</p> <p>i have a <a href="http://jsfiddle.net/mendelthecoder/7uwMH/" rel="nofollow">function <code>nothingIsBelow()</code></a> which checks if the piece has reached the bottom, so i am pretty stumped as to why this is happening.</p> <h2>edit</h2> <p>i wasnt clear enough on this point before <strong>it works fine the first 3-4 pieces (aside for piece collision protection) <em>and only gives me above error when <code>fallingPiece</code> has a previously held value</em></strong> </p> <h2>edit</h2> <p>it seems that the issue is like this i have a array <code>shapes</code></p> <pre><code>var shapes = [ [{y:0,x:4},{y:0,x:5},{y:0,x:6},{y:0,x:7}], [{y:0,x:4},{y:0,x:5},{y:0,x:6},{y:1,x:4}], [{y:0,x:4},{y:0,x:5},{y:0,x:6},{y:1,x:5}], [{y:0,x:4},{y:0,x:5},{y:0,x:6},{y:1,x:6}], [{y:0,x:4},{y:0,x:5},{y:1,x:4},{y:1,x:5}], [{y:0,x:4},{y:0,x:5},{y:1,x:3},{y:1,x:4}], [{y:0,x:4},{y:0,x:5},{y:1,x:5},{y:1,x:6}] ]; </code></pre> <p>and i have a line of code assigning a shape to a new piece</p> <pre><code>fallingPiecePos = shapes[fallingPiece - 1]; </code></pre> <p>it seems that when i later refer to <code>fallingPiecePos</code> and change the value (<code>fallingPiecePos[i].y++;</code>), it changes the value in <code>shapes</code> as well</p> <p><strong>in simple terms</strong> the following code</p> <pre><code>var myArray = [ [{a:0,b:1},{a:1,b:1}], [{a:0,b:0},{a:1,b:0}] ]; var foo = myArray[0]; foo[0].a++; console.log(myArray[0][0][a]); </code></pre> <p>will give me <code>1</code> because not only <code>foo</code> but also <code>myArray</code> was updated, so how can i make a variable which holds a <strong>new</strong> array (<code>foo</code>) holding the values of <code>myArray[0]</code> and can be updated without updating <code>myArray[0]</code>.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload