JavaScript

Javascript Array Length Example

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());
Download
You can download the full source code of this example here: JavascriptArrayLength

Dmitry Mishchenko

This year I graduate from Applied Mathematics department of Brest State University. I'm fond of genetic algorithms and my degree work will be about generating timetables. Also I'm keen on programming and web-development, especially Java and Javascript. Now I work as a Java Developer at Java department of VRP Consulting.
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Back to top button