Home » JavaScript

Arrays in JavaScript

In this article, we are going to learn about arrays data structure in JavaScript along with its most useful methods like push, pos, shift, unshift, splice etc.
Submitted by Himanshu Bhatt, on August 09, 2018

Here we are discussing one of the most useful data structure, Array.

By conventional definition of arrays, "Arrays are the homogeneous collection of data types. But in JS, Arrays simply are the collection of different data types, may or may not be the same.

Now let’s see an example:

let week = ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturdday','Sunday'];

console.log(week[0]);       //line 1
console.log(week[6]);       //line 2
console.log('Size of array',week.length);   //line 3

week.pop();      //line 4
week.pop();

console.log(week);  //line 5

week.push('Saturday');
// week.push(1)     //Line 6

console.log('After Line 6\n',week);

week.unshift('Sunday');  //Line 7
console.log('After Line 7\n',week);

week.splice(3,1,"IncludeHelp");  //line 8

console.log('After line 8\n',week);

In the above code snippet, we created an array of name week, we created with 7 elements. In line 1 and 2 we used console.log to print the element of our array week.

We can access to a particular element of an array by using [ ] proceeded by name of the array and inside the square brackets we write the index of the element. Like arrayName[Index]

The interesting thing is indexing of the array starts with 0, not 1, that means the index of Monday in our week array will be 0, not 1 and then the last element will become 6. Thus line 1 & 2 we will get a first and last element of the array respectively.

Now move to line 3, week.length as the name suggests it return the length of the array, in our case, it’s 7. We can use it as arrayName.length and it will be an integer value.

The pop function will delete the last element from the array every time being called, the syntax for it is arrayName.pop(). Therefore, in line 5, we got 5 elements after 2 successive pops. Similarly, shift function will delete an element from the beginning and its syntax is arrayName.shift().

The push function is used to add an element at the end of the array, and its syntax is arrayName.push(element), where the element is data type independent it could be integer floating value or a string. Try uncommenting line 6 and observe what happens. But if we wanted to add an element at the beginning we shall use unshift function which is having a syntax similar to pop as arrayName.unshift(element) like we used in line 7.

Now, move to splice function which basically, removes an element or series of elements from a position and optionally can add/insert an element at that position. Let’s see its syntax, arrayName.splice(startIndex, count,[optional] string), here the start index is the index from where the first element will delete and the count tells the number of elements to delete, if it’s one then only the element at startIndex will be delete and say count is two then the startIndex and element next to it will be deleted. If no third argument passed so they will be deleted but it contains some element they will insert at that index.splice can be used to add an element at a particular index with the following way:

arrayName.splice(Index,0, element) this will add the element at the mentioned index without deleting the prior elements, their position will be increment by one.

Output for the above code:

Read mode: forEach method of array

JavaScript Tutorial »

---