How Arrays Work?

An array is the most common and simplest data structure.

The elements in the array are stored in sequential order. That is one after another.

Let’s see what this means:

If we have the following array:

const avengers = [‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’];

The first item is stored in index 0, the second in index 1, and so on. It is important to know that indexing of the array begins from 0.

An array of Avengers with indexes

We can perform various operations with an array. Some of them are as follows:

1. Access Element
2. Insert Element
3. Delete Element

Now, let’s see how we perform these operations and the time complexities involved in these operations.

In case you don’t know how the time complexities work : How to calculate Big O. We calculate the Big O notation in the… | by Palistha | Apr, 2022 | Medium

1. Access Elements

Accessing elements from an array is easiest. We just have to know the index of the element.

const avengers = [‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’];
// access the 4th element
console.log(avengers[3]);

Output

Hulk

We can access the 4th element just by using the index of the element.

Even if the size of the array grows, the step to access elements of the array remains the same. So, the time complexity to access an element of an array is O(1). Which means it is fast.

2. Insert Elements

Let’s see how inserting elements in an array work:

const avengers = [‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’];
// insert element at the beginning of the array
avengers.unshift(‘Spiderman’);
console.log(avengers);

Output

[ ‘Spiderman’, ‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’ ]

The unshift() method inserts an element at the beginning of the array.

When we add Spiderman to the array. It gets added to index 0. This means the element Ironman will shift to index 1, Antman to index 2, Thor to index 3, and Hulk to index 4.

Add an element to beginning of an Array

If the number of elements in the array increases, the steps to shift the elements will also increase.

This means the time complexity of inserting an element in an array is O(n).

However, when we add elements at the end of the array:

const avengers = [‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’];
// insert element at the end of the array
avengers.push(‘black panther’);
console.log(avengers);

Output

[ ‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’, ‘black panther’ ]

Add element at last index of an Array

There is no shifting of the elements. So, the time complexity is O(1).

3. Delete Element

const avengers = [‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’];
// delete first element of an array
avengers.shift();
console.log(avengers);

Output

[ ‘Antman’, ‘Thor’, ‘Hulk’ ]

The shift() method deletes the element from the beginning of the array.

When we remove Ironman from the array, Antman shifts to index 0, Thor to index 1, and Hulk to index 3.

Delete first element from an array

If the number of elements in the array increases, the steps to shift the elements will also increase.

This means the time complexity of deleting an element from an array is O(n).

However, here’s what happens when we delete an element at the end of the array.

const avengers = [‘Ironman’, ‘Antman’, ‘Thor’, ‘Hulk’];
avengers.pop();
console.log(avengers);

Output

[ ‘Ironman’, ‘Antman’, ‘Thor’ ]

Delete element from last index

There is no shifting of the elements. So, the time complexity is O(1).