Arrays are one of the most used Data Structures in JavaScript and pretty much any language. Today I'll be talking about what they are, what they do, and when to use them.

So let’s get to it!

What are Arrays

To start off I'll be talking about Arrays. This is a Data Structure, most programmers are familiar with, that organizes data sequentially as shown below.

let basket = ['🥧', // 0 index
              '🍤', // 1st index
              '🍇', // 2nd index
              '🍒', // 3rd index
              '🍏', // 4th index
              '🍎'] // 5th index

Pretty simple right? Arrays are really nice because they are a small and simple data structure that is contiguous in memory, meaning that each value is stored right next to each other, so you don't have to allocate a lot of space to store data.

Also in JavaScript arrays are resizable and dynamic in nature. In contrast to static arrays in other languages which have a predefined size, so you cannot add more values to them. Instead of static arrays, you need to move the array over to a different location in memory in order to increase the size essentially creating a whole new array.

Methods for Arrays

When using arrays these are some common methods that have varying time complexities:

• Access the i-th Element O(1) - Constant Time: Since we are essentially accessing the key: which is the index and the value which is the data stored in that index.

• Search O(n) - Linear Time: Since we have to use the index to access the value we won’t be able to just instantaneously access a value instead we will have to loop through n items of the array to get a certain value.

• Override the Element at i-th index O(1) - Constant Time: Similar to accessing the i-th Element all it takes is using the key: index to change the value at a certain index.

• Traverse All Elements O(n) - Linear Time: Looping through each element is similar to searching so we will be going through however many n items are in the array.

• Insertion O(n) - Linear Time: Order matters in an array so if you insert an element in any index that isn't the last index you will have to shift the indexes after and increase their index number by 1. The act of shifting the indexes increases the time complexity to O(n) items needing to be shifted.

• Deletion O(n) - Linear Time: Similar to above except you will have to shift the indexes after by decreasing their number by 1.

As we can see there are different types of time complexities for the different types of methods for arrays. But as we notice with the last two, Insertion and Deletion, they differ for the last index of the array. In JavaScript this is also evident from the fact that they have two very special names for their methods:

basket.push()

basket.pop()

As the name implies pop() will delete an index from the end of the array reducing the size. While push() will add to the end of the array increasing the size. Both of which are constant time.

When to use JavaScript Arrays

So Imagine you have a deck of cards:

A good time to use an array could be if you are creating a card game where you are only getting cards from the end of the deck. This will allow you to utilize the O(1) time complexity of pop() and push() to get cards from the top of the deck. Also In a deck of cards the order in which you put the cards matters so it will also be represented by the indices of the array.

In Conclusion

JavaScript Arrays allow us to store memory that is contiguous, of different data types, and ordered. Although it does have some tradeoffs when it comes to insertion and deletion because of shifting the indexes. It has a fast lookup and changing of an index. It can also be the building block to more complex data structures that we will talk about in the future.

Also published here.