i'm getting the error
Uncaught TypeError: Cannot set property '0' of undefined
for some reason in this line
world_map_array[i][z]="grass.gif|ongrass.gif|collision.gif|above.gif";
Why is this happening?
thanks for any help
var x_world_map_tiles = 100; var y_world_map_tiles = 100; var world_map_array = new Array(x_world_map_tiles); for (i=0; i
Arrays in JavaScript have quirks of their own that you may not be expecting if you come from other languages. Two important ones for your use case are:
- You cannot directly declare multidimension arrays in JavaScript.
- There's little efficiency benefit (and no added safety) when you set the size of the array at creation.
Unlike other languages, JavaScript won't allocate a block of memory for the full array. (It doesn't know what kind of objects you're going to be putting in each cell, and therefore how much total memory it will need.) Instead, all the size
argument to Array()
does for you is set the array's length
property.
For the general, 2d array case, I'd suggest:
Create the "top" array, e.g.:
var i // the first-order index in a , j // the second order index in a , a = []
Initialize array elements as needed. This is called lazy initialization, and, in this case, it simply involves testing that a[i]
exists before we try to assign something to a[i][j]
, e.g.:
if (!a[i]) a[i] = []
In English the above statement reads: "If the i-th element of a
is 'falsy', assign an empty array to the i-th element."
Finally, assign the actual value to the multideminsional array:
a[i][j] = 'whatever'
For your case, you know the values ahead of time, so you can initialize each element in advance. (If you're not overriding most of the elements, however, a lazy implementation may be better; see below.)
var x, x_length = 100 , y, y_length = 100 , map = [] // Don't be lazy for (x = 0; x
As some others have said, an array with 100 elements has indexes numbered from zero to ninety-nine, so a less-than comparison is most appropriate here.
For reference, here's an implementation that uses lazy initialization. I've gone with a function interface instead of directly accessing the array; it's longer and more complex, but also more complete.
The initialization pattern I've used here is called an immediately invoked function expression. If you haven't seen it before, it's one of the more useful JavaScript patterns and well worth taking some time to understand.
var map = (function (x_length, y_length, v_default, undefined) { // Unless v_default is overwritten, use ... v_default = v_default || 'grass.gif|ongrass.gif|collision.gif|above.gif' // Private backing array; will contain only values for a[x][y] // that were explicitly set. var a = [] // Private helper function. // - Returns `true` if `x` is between `0` and `x_length - 1` // and `y` is between `0` and `y_length - 1`. // - Returns `false` otherwise. function valid (x, y) { return (x >= 0 && x = 0 && y 2) { return set(x, y, v) } else { return get(x, y) } } })(100, 100)
When I ran the above in node, the following tests printed sensible values:
// Invalid invocations console.log('map() : %s', map()) console.log('map( 0) : %s', map(0)) console.log('map( -1, 0) : %s', map(-1,0)) console.log('map( 0, -1) : %s', map(0, -1)) console.log('map( -1, -1) : %s', map(-1, -1)) // Valid invocations console.log('map( 0, 0) : %s', map(0, 0)) console.log('map( 99, 99) : %s', map(99, 99)) console.log('map( 1, 1) : %s', map(1,1)) console.log('map( 1, 1, "foo") : %s', map(1,1, 'foo')) console.log('map( 1, 1) : %s', map(1,1))
var x_world_map_tiles = 100; var y_world_map_tiles = 100; var world_map_array = new Array(x_world_map_tiles); for (i=0; i
As your array has a length of 100, you must go from 0
to 99
(100 (
You're feeding the world_map_array[i]
expression a value for i
that does not exist in world_map_array
. So I guess x_world_map_titles
is > 2.
I think you need to rewrite i to i
Also you do not need to specify the size of the array. I would just use literals in this case:
var x_world_map_tiles = 100; var y_world_map_tiles = 100; var world_map_array = []; for (i=0; i