DEV Community

Cover image for JavaScript Data Structures and Algorithms (Arrays, part 1)
Oscar Luna
Oscar Luna

Posted on • Edited on

JavaScript Data Structures and Algorithms (Arrays, part 1)

Hello! It's been a while since I last wrote. I've been in a slump and not coping appropriately. But that's another story. Today I feel better and I thought I'd write about some of the Data structures that you can expect to be asked about at technical interviews. This will be a lengthy series since I can't speak on any data structure without the algorithms available to access, insert, delete, and search through these structures. I will assume you have a base understanding of JavaScript and of Big O Notation if you are reading this, so bear with the rudimentary lexicon ahead. Let's dive right in.

As a quick note, I encourage you, the reader, to comment below if there is any misinformation in this post. This is the area I struggle with the most. After all, we are all here to learn from each other, and to document what we learn with these blog posts. Tl;dr Fact check me if necessary please.

Arrays
Arrays are probably the Data structure you will work with the most as you write your code. Arrays are a collection of values that are stored between square brackets. Which is to say, these values get allocated in memory. Each value in an array contains a numerical index in ascending order from first to last. As I mentioned before, memory for arrays is allocated, or pre-determined. Their size cannot be mutated without the appropriate algorithms (more on this in a bit). Also, arrays are zero-indexed, which is to say that the first index in an array is not 1, but rather 0. This is a basic caveat but crucial that we remember.

Insertion
JavaScript exposes methods for us to insert an element in an array. We can use push(element) to insert an element at the end of an array. JavaScript does not need to iterate through a whole array to find the last index, and because of this, push() has a linear time complexity, or O(1). Contrarywise we can also insert an element at the first index of an array, at index 0, using unshift(). This method also has linear time complexity, O(1). One more thing: these methods return the array with the remaining values after running the aforementioned methods.

var arrayExample = [1, 2, 3, 4, 5]
arrayExample.push(6) //arrayExample = [1,2,3,4,5,6];
arrayExample.unshift(0) //arrayExample = [0,1,2,3,4,5,6];
Enter fullscreen mode Exit fullscreen mode

Deletion
Deletion is as simple as Insertion is when it comes to arrays. To remove the last element of an array we can use the pop() method, and to remove the first element of an array we can use shift(). Like their insertion counterparts, these methods also have O(1) complexity, and return the original array minus the removed values.

arrayExample.pop(); //arrayExample = [0,1,2,3,4,5];
arrayExample.shift(); //arrayExample = [1,2,3,4,5];
Enter fullscreen mode Exit fullscreen mode

Access
To access an element of an array, we simply specify the index of the desired element. This process has linear complexity as well, O(1). Just remember what I mentioned about arrays being zero-indexed.

var arrayExample = [1,2,3,4,5]
var desiredElement = arrayExample[2] //prints 3
Enter fullscreen mode Exit fullscreen mode

Iteration
Indices are how we iterate through each element in an array. Expect to have to use some form of iteration at a technical interview. I am of course referring to the use of loops. This process' time complexity is directly correlated to the number of elements in an array. Whether an array has 2 elements, or 200 elements, its time complexity is O(n), where n is the number of elements in an array. JavaScript exposes many ways to iterate through an array's elements, but all have the same time complexity.
I'm sure you already have one of these in mind already; the ever-so-common for loop. We initialize a variable i, and for every index in an array (beginning with 0), one by one, our program will run a given set of directions; an algorithm. Loops run for as long as they remain true, so be sure to provide a point where your loop can become false, lest it run forever and crash.

for(let i =0; i < arrayExample.length; i++) {
  //strut it out
} 
Enter fullscreen mode Exit fullscreen mode

One way to prevent an infinite loop is to call variables by their indices one by one, using for(in):

for(var index in arrayExample) {
  //walk a mile
}
Enter fullscreen mode Exit fullscreen mode

We can also specify variables of an array with for(of):

for(var element of arrayExample) {
  //serve it ancient city style
}
Enter fullscreen mode Exit fullscreen mode

If you want to be more expressive with what your loop must run for each element, such as running a function at each element of an array, we can use forEach():

arrayExample.forEach(function(element, index) {
  //talk it out
  //babble on
  console.log(element[index]) //prints 1,2,3,4,5
});
Enter fullscreen mode Exit fullscreen mode

Simple, no? Data Structures from here on out build on top of this information, so with a good foundation of knowledge, and plenty of tenacity, you are capable of mastering this branch of programmming. That's all for now. Next time I'll go a little deeper into array functions before moving on to the next data structure. So stay tuned! Peace!

Oh! One more thing. For a visual breakdown of data structures and algorithms, check out VisuAlgo. It provides animations for insert/delete/search/iterate for data structures, along with written explanations. It sure helped me a lot. K, Til next time!

Top comments (0)