CODEWITHSUNDEEP
javascriptarrays
AL-zami
AL-zami

Reputation: 9066

what new Array(20) actually do

Here i have a Store constructor which has a property named arr which is created using new Array(height*width) provided height and length were sent as arguments to Store constructor.What i know is new Array(20) will create an array which can contain 20 elements.

The Store constructor has a prototype property which uses a map array and fill this.arr of the new Store instance.

But surprisingly the array length gets extended after the fill up process.It becomes 40.I know push method insert elements at the end of an array.Does it mean the array was already has 20 elements.But it supposed to be empty ,right?? i am confused!!!

var map=['d d d d d ',
         'e e e e e ']
function Store(width,height){
    this.width=width;
	this.height=height;
	this.arr=new Array(this.width*this.height);
}
Store.prototype.set=function(map){
    for(i=0;i<this.height;i++){
	    for(j=0;j<this.width;j++){
		    this.arr.push(map[i][j]);
		}
	}
}
var store=new Store(map[0].length,map.length);
document.write('previously : '+store.arr.length+'</br>');
store.set(map);
document.write('now : '+store.arr.length);

Upvotes: 0

Views: 136

Answers (2)

thefourtheye
thefourtheye

Reputation: 239573

When you create an Array, with Array constructor, it creates a sparse Array with the length specified. So when you say Array(20) it has created an Array with 20 elements (by changing the length property), which are not defined yet, in it. So, lets say that the length is set to 5 and you are trying to access the element at 0. Now, JavaScript will look for the property 0 in the Array object and it will not find anything. So, it will return undefined. But when you do something like array[0] = 1, it assigns the property 0, the value 1. So the next time when you look for array[0], it will return 1. Practically, when you simply create an Array, there is nothing in it.

Regarding the push, quoting from MDN's Array.prototype.push,

The push() method adds one or more elements to the end of an array and returns the new length of the array.

So, it has been extending the array whenever you are pushing something to it. You might want to do something like this

this.arr[i][j] = map[i][j];

Upvotes: 2

Andrija Petrovic
Andrija Petrovic

Reputation: 209

new Array(20) creates an array with 20 elements that are undefined. But the very storage within the array is preallocated. This is considered to be a more efficient way of handling arrays. If you know the array length in advance, always use this approach. (By the way, it is even more beneficial to have all the elements of the array to be of the same type)

In case you preallocate an array, do not push elements to it. Assign values to elements within the array, like this:

var map=['d d d d d ',
         'e e e e e ']
function Store(width,height){
    this.width=width;
	this.height=height;
	this.arr=new Array(this.width*this.height);
}
Store.prototype.set=function(map){
    for(i=0;i<this.height;i++){
	    for(j=0;j<this.width;j++){
		    this.arr[i*j+j] = map[i][j];
		}
	}
}
var store=new Store(map[0].length,map.length);
document.write('previously : '+store.arr.length+'</br>');
store.set(map);
document.write('now : '+store.arr.length);

If you do not know the array size in advance, create an empty zero length array, and push (or unshift, push puts an element to the last position in the array, unshift puts the element to the first, 0 index, position in the array) elements to it. This works slower, because each push or unshift will dynamically change the size of the array.

Upvotes: 1

Related Questions