Advanced Java and Web Technologies for JNTUK
Blog providing beginner tutorials on different web technologies like HTML, CSS, Javascript, PHP, MYSQL, XML, Java Beans, Servlets, JSP and AJAX

23/02/2014 Categories: Javascript. No Comments on Arrays in Javascript

An array is a collection of elements. Unlike in Java, arrays in JavaScript can contain elements of different types. A data element can be a primitive value or a reference to other objects or arrays.

An Array object can be created in two ways. First way is by using the new operator as shown below:

var array1 = new Array(10, 20, “hai”); 

var array2 = new Array(10);

In the first declaration, the size of array1 is 3 and the values are initialized to 10, 20 and “hai”. In the second declaration, the size of array2 is 10 and the elements are not initialized.

Second way to create an Array object is by specifying an literal array in square brackets as shown below:

var array3 = [1, 2, “hai”]; 

In the above declaration, size of array3 is 3 and values are initialized to 1, 2 and “hai” respectively.

An array element can be accessed using the index or subscript which is included in square brackets. In JavaScript the index of every array starts with zero. An array element can be accessed as shown below:

document.write(“Second array element is: “, array3[1]); 

Arrays in JavaScript are dynamic and are always allocated memory from heap. The size of an array can be accessed or changed by using the length property of an Array object as shown below:

var array1 = new Array(10);    //Length is 10

array1.length = 20;   //Now length is 20 

 

Array Methods

Several methods are available on an Array object to perform various manipulations on the array elements. Most frequently used methods are mentioned here:

The method join is used to convert the array elements into string and join them into a single string separated by the specified string. If no separator is given, all the elements are joined using commas. Below example demonstrates join method:

var names_array = [“Ken”, “John”, “Mary”];

var names_string = names_array.join(“-“); 

Now names_string contains the string “Ken-John-Mary”.

The method reverse is used to reverse the order of array elements and the method sort converts the array elements into strings and then sorts them in alphabetical order.

The method concat appends the specified elements to the end of the Array object as shown below:

var names = [“Ken”, “John”, “Mary”];

var names = names.concat(“Mike”, “James”); 

Now, names array contains, “Ken”, “John”, “Mary”, “Mike” and “James”. Length of names array will be 5.

The method slice is used to retrieve subset of elements in an Array object. This method accepts two parameters, starting index and ending index. All the elements from starting index excluding the ending index are retrieved. Below example demonstrates slice method:

var nums1 = [10, 20, 30, 40, 50];

var nums2 = nums1.slice(2,4); 

Now nums2 contains [30, 40]. If no ending index is specified, all the elements from starting index to last element in the array are returned.

The method toString is used to convert the array elements into strings and concatenate them using commas. This method behaves same as join method when applied on array of strings.

The methods push and pop behave as stack operations. The method push is used to append an element at the last position in an array and the method pop is used to return the last element of the array.

The methods shift and unshift are used to remove and add elements at the starting index of the array respectively.

 

Two-Dimensional Arrays

A two-dimensional array in JavaScript can be thought of as an array of arrays. It can be created using the new operator or with nested array literals as shown below:

 

Suryateja Pericherla

Suryateja Pericherla

Hello, I am Suryateja Pericherla working as an Asst. Professor in CSE department at Vishnu Institute of Technology. I write articles to share my knowledge and make people knowledgeable regarding certain topics.
Suryateja Pericherla

Latest posts by Suryateja Pericherla (see all)

Related Links:

Note: Do you have a question on this article or have a suggestion to make this article better? You can ask or suggest us by filling in the below form. After commenting, your comment will be held for moderation and will be published in 24-48 hrs.

Leave a Reply

Scroll Up