Array

An array has continuous memory layout. JavaScript has no actual array but uses objects to imitate it. If you want to create a so-called array (here we still call it array) in JavaScript, you can use the Array constructor. For example:

js> var array1 = new Array();
js> array1.length;
0
js> var array2 = new Array(10);
js> array2.length;
10
js> var array3 = new Array(10, 20, 30);
js> array3.length;
3
js>

The above demonstrates three ways to create an Array instance. The first way creates an empty Array instance. The second creates an Array instance of length 10 and each value of indices 0 to 9 is undefined. The third way creates an Array instance with three elements, 10, 20 and 30 respectively from index 0.

In fact, real JavaScrip developers rarely use the Array constructor to create an Array instance but use an array literal. For example:

js> var array1 = [];
js> array1.length;
0
js> var array2 = [];
js> array2.length = 10;
10
js> array2.length;
10
js> var array3 = [10, 20, 30];
js> array3.length;
3
js>

Your eyes didn't deceive you. In JavaScript, The length property of an Array instance is updatable. For example:

js> var array = [1, 2, 3];
js> for(var i = 0; i < array.length; i++) {
>     print(array[i]);
> }
1
2
3
js> array.length = 5;
5
js> for(var i = 0; i < array.length; i++) {
>     print(array[i]);
> }
1
2
3
undefined
undefined
js> array.length = 2;
2
js> for(var i = 0; i < array.length; i++) {
>     print(array[i]);
> }
1
2
js> array.length = 3;
3
js> for(var i = 0; i < array.length; i++) {
>     print(array[i]);
> }
1
2
undefined
js>

In the above example, the original length is 3, and then assigned 5. Values of indices 3 and 4 are all undefined. While the length is assigned 2, the value of index 2 is gone even if length is assigned 3 again.

An array has continuous memory layout. JavaScript has no actual array but uses objects to imitate it. In fact, the indices of an Array instance are actually properties with numeric names. As a matter of fact, an index can be assigned a string if it represents a number.

js> var array = [1, 2, 3];
js> array['0'];
1
js> array['1'];
2
js> array['2'];
3
js> for(var i in array) {
> print(i);
> }
0
1
2
js> delete array[1];
true
js> array;
1,,3
js>

Therefore, you can use delete to delete elements in an Array instance because indices are actually properties of an Array instance. And that, you can easily use a plain object to imitate an Array instance.

js> var obj = {
>     '0' : 100,
>     '1' : 200,
>     '2' : 300,
>     length : 3
> };
js> for(var i = 0; i < obj.length; i++) {
>     print(obj[i]);
> }
100
200
300
js>

The obj is so-called an array-like object. What's good for you to create an Array instance or what are the benefits to an array literal? Of course, in order to own behaviors defined on Array, such as automatic updates of the length property according to numbers of elements.

js> var array = [];
js> array.length;
0
js> array[0] = 100;
100
js> array.length;
1
js> array[1] = 200;
200
js> array.length;
2
js> array[10] = 900;
900
js> array.length;
11
js>

The length property of an Array instance can increase or decrease at any time. Also, array elements can be assigned without continuous indices. For the above example, index 10 is assigned 900 and the unassigned indices 2 to 9 are all undefined, like nonexistence of properties 2 to 9. There's no so-called 'index out of bound' problem in JavaScript. In the above example, trying to retrieve the value of array[10000] will just get undefined.

Using an Array instance directly can own methods defined on Array. For example:

js> var array = [100, 200, 300];
js> array.forEach(function(element) {
> print(element);
> });
100
200
300
js>

The forEach method is defined on Array. It accepts a callback function and iterates over the array elements. At each iteration, it calls the callback function and pass it an iterated element. This is a preferred way for JavaScript to iterate elements of an Array instance (or an array-like object). Like forEach, there are many methods that accept functions on Array.

The following example demonstrates the push and pop methods on Array:

js> var array = [];
js> array.push(100);
1
js> array.push(200);
2
js> array.push(300);
3
js> array;
100,200,300
js> array.pop();
300
js> array;
100,200
js> array.pop();
200
js> array;
100
js>

For more methods on Array, take a look at:

Array