Every programmer learning a new language has to study the way it manages arrays and their size.
In native Javascript, length is a property of every array and obviously it is used to retrieve or set the length of that array.
The length property is a part of the Array prototype and may be a non-negative integer less then 232.
Let’s look at a simple case of usage, where we’ll just initialize a new array and output its length.
var arr = [ "First", "Second", "Third", "Fourth" ];
document.write(arr.length); // outputs "4"
The length of an array is dynamic so we can fill the array dynamically
var arr = [];
for (var i = 0; i < 5; ++i) {
arr[i] = i;
document.writeln(arr.length); // outputs i + 1
}
If you don’t want to store the array’s size or you want to add one more element at the end of it (as in stack), you can use the following approach. The example adds all the properties of an object to an array:
var obj = {
zero: '0',
one: 1,
two: new Date()
};
var arr = [];
for (elem in obj)
arr[arr.length] = obj[elem];
console.log(obj);
console.log(arr);
But if we use numbered indexes, length is not defined by the number of elements in there but by the largest index + 1
var arr = [];
arr[1] = 1;
arr[4] = 4;
document.writeln(arr); // [ , 1, , , 4 ]
document.write(arr.length); // length is 5 not 2
And when we use for example string indexes (treated as object properties) array behaves more like a map. Javascript defines array as an object and the length will return 0:
var arr = [];
arr['first'] = 1;
arr['fourth'] = 4;
console.log(arr); // {first: 1, fourth: 4}
document.write(arr.length); // length is 0
What about two-dimensional arrays?
Since a two-dimensional array is essentially an array which contains arrays, the array.length method returns the length of the parent-array;
var arr = [];
arr[0] = [];
arr[1] = [ "One element"];
arr[2] = [ 2, 3 ];
arr[3] = [ new Date(), null, "Third", 1 ];
console.log(arr);
document.write(arr.length); // outputs 4
If you want to reduce the size of an array, you can simply set the length property:
var arr = [ 0, 1, 2, 3, 4, 5, 6, 7 ];
document.writeln("Initial length = " + arr.length);
arr.length = 5; // [ 0, 1, 2, 3, 4 ]
document.write("New length = " + arr.length);
If new array length is larger than current the array will be filled with undefined values:
var arr = [ 0, "1", new Date() ];
document.writeln("Initial length = " + arr.length);
arr.length = 5; // [ 0, 1, 2, , ]
document.writeln("New length = " + arr.length);
console.log(arr[4]); // undefined
Be careful while modifying an array and iterating over it using length property at the same time:
var arr = [ 10, 20, 30 ];
var i = 0;
while (i < arr.length) {
arr[arr.length] = i;
++i;
} // never ends up
Some frameworks like Prototype may define something like size() method in Array prototype but one should notice that it’s not a native javascript feature. Here is a quick example:
var arr = new Array(); arr.push(1); arr.push(2); document.write(arr.size());
You can download the full source code of this example here: JavascriptArrayLength
