Learn Arrays in JavaScript

An array is an object that can store a collection of items. Arrays become really useful when you need to store large amounts of data of the same type. Suppose you want to store details of 500 employees. If you are using variables, you will have to create 500 variables whereas you can do the same with a single array. You can access the items in an array by referring to its indexnumberand the index of the first element of any array is zero.
Creating an Array
You can create an array in JavaScript as given below.
?
1
var students = ["John", "Ann", "Kevin"];
Here, you are initializing your array as and when it is created with values “John”, “Ann” and “Kevin”.The index of “John”, “Ann” and “Kevin” is 0, 1 and 2 respectively. If you want to add more elements to the students array, you can do it like this:
?
1
2
students[3] = "Emma";
students[4] = "Rose";
You can also create an array using Array constructor like this:
?
1
var students = new Array("John", "Ann", "Kevin");
OR
?
1
2
3
4
5
6
7
var students = new Array();
 
students[0] = "John";
 
students[1] = "Ann";
 
students[2] = "Kevin";
Properties and Methods
The Array object has many properties and methods which help developers to handle arrays easily and efficiently. You can get the value of a property by specifying arrayname.property and the output of a method by specifying arrayname.method().
  1. length property --> If you want to know the number of elements in an array, you can use the length property.
  2. prototype property --> If you want to add new properties and methods, you can use the prototype property.
  3. reverse method --> You can reverse the order of items in an array using reverse method.
  4. sort method --> You can sort the items in an array using sort method.
  5. pop method --> You can remove the last item of an array using pop method.
  6. shift method --> You can remove the first item of an array using shift method.
Try this yourself:
This code is editable. Click Run to Execute
1
​
2
    <html>
3
​
4
    <head>
5
​
6
    <title>Arrays!!!</title>
7
​
8
    <script type="text/javascript">
9
​
10
    var students = new Array("John", "Ann", "Aaron", "Edwin", "Elizabeth");
11
​
12
     
13
​
14
    Array.prototype.displayItems=function()
15
​
16
    {
17
​
18
      for (i=0;i<this.length;i++)
19
​
20
        {
21
​
22
    document.write(this[i] + "<br />");
23
​
24
        }
25
​
26
    }
27
​
28
    document.write("students array<br />");
29
​
30
    students.displayItems();
31
​
32
    document.write("<br />The number of items in students array is " + students.length + "<br />");
33
​
34
    document.write("<br />The SORTED students array<br />");
35
​
36
    students.sort();
37
​
38
    students.displayItems();
39
​
40
    document.write("<br />The REVERSED students array<br />");
41
​
42
    students.reverse();
43
​
44
    students.displayItems();
45
​
46
    document.write("<br />THE students array after REMOVING the LAST item<br />");
47
​
48
    students.pop();
49
​
50
    students.displayItems();
51
​
52
    </script>
53
​
54
    </head>
55
​
56
    <body>
57
​
58
    </body>
59
​
60
    </html>
61
​
at