JavaScript Arrays

JavaScript arrays are by far my favorite data structure. They are obviously not the best choice to use in all cases, but, whenever possible, I prefer to work with arrays. In my opinion they are just easier to deal with. So what exactly is an array? In a nutshell an array is an ordered list of values where each value, or element, in the array is specified by an index. Array indexes can also be made up of different datatypes, so you could have an array where the indexes are a mixture of strings, integers, boolean values, objects, and even other arrays made up of mix value indexes. Another awesome feature of JavaScript arrays, is that you don't have to specify the length of the array upon creation like you do in a language like C.

Creating an array in JavaScript is pretty straight forward. You simply declare a variable with one of JavaScript's three variable keywords followed by a pair of square brackets containing the index values.

   let numbers = [1, 2, 3, 4, 5];
   var array = ["hello", 9, true, [1, 2, 3]];
   const array2 = [];

Here I have created three arrays using the different JavaScript variable keywords. The first arrays consists of only integers, and the second array is a mixture of a string, an integer, a boolean value and another array of numbers.The third array is set to an empty array. Empty arrays can be useful as a place to store future values.

To wrap our head around how array indexes work, let's look at the second array. The second array contains four elements. Since we are dealing with computers we always start counting with zero, so the first element in the array, at the 0 index, is the string, "hello." The element in the fourth position, with the index of 3, is another array of integers. You can access the values of the individual indexes with square bracket notation like this:

var array = ["hello", 9, true, [1, 2, 3]];
console.log(array[3]);
// [1,2,3]
console.log(array[0]);
// "hello"

You can also change the value of an array index using bracket notation like this:

var array = ["hello", 9, true, [1, 2, 3]];
array[1] = 10;
// console.log(array); 
// ["hello", 10, true, [1, 2, 3]]

So far we have been creating arrays with bracket notation, but there is another, albeit less used, way to create arrays in JavaScript. You can simply write:

let numbers = new Array(1, 2, 3, 4, 5);
// console.log(numbers);
// [1, 2, 3, 4, 5]

I prefer to create arrays the other way, but it's ultimately up to you.

We are just barely scratching the surface of what is possible when it comes to JavaScript arrays. There are all kinds of useful array methods available to the JavaScript programmer, and I have already written posts on two of my favorite array methods .map() and .filter(). However, I would like to leave you with what I think is the most useful array feature built into the JavaScript language, and that is the .length property. With .length you can find out the size of an array by simple writing:

   var array = ["hello", 9, true, [1, 2, 3]];
   console.log(array.length);
   // 4

The ability to know the length of an array is useful in things like for loops and what not, but it really comes in handy when dealing with arrays where you don't initially know what the size is. For example, like when you are fetching data from an external API.

I plan to write future posts about other array methods that I find useful, but, in the meantime, I hope this post has helped anyone new to JavaScript, or programming in general, get acquainted with my favorite JavaScript data structure, the easy to use and powerful array.

Happy coding!