Learn JavaScript Arrays

In JavaScript we use arrays to store a list of values. Arrays are always numbered starting from 0.
This means that the 2nd element in your array is at number 1 while the last element is always the total number minus 1.

We will first create an array, check its length and access its contents. Then we will learn the methods you can use to modify your array. We will finally see how you can check for the presence of an element with indexOf().

Let's say you want an array showing the countries you would like to visit...

let countries = ['morocco', 'kenya', 'malawi', 'eritrea', 'ghana', 'ethiopia'];

Now lets check the length of our array:

console.log(countries.length);

The console.log returns 6!

Now, lets say you quickly want to access the third country in your array. It will be denoted with a 2, remember what we said about the denoting the first index in our array, its always a zero.

console.log(countries[2]);

In the above case, the console.log will return
malawi

Accessing the first country:

console.log(countries[0]);

The above code returns morroco which is the first country in our array.

Let's see how arrays can easily be modified.
You have decided that Egypt needs to be on the list of countries you're visiting.

Let's use the push() method to add Egypt.

countries.push('egypt');

In the above case the,

console.log(countries);

will return,

[ 'morocco',
'kenya',
'malawi',
'eritrea',
'ghana',
'ethiopia',
'egypt' ]

The push() method adds elements at the end of the array while the unshift() method adds elements at the beginning.
Lets see the unshift() works now.

countries.unshift('egypt');

The console.log will return:

[ 'egypt',
'morocco',
'kenya',
'malawi',
'eritrea',
'ghana',
'ethiopia' ]


Sometimes you might want to remove an element. In that case you use the pop() and shift() methods. How? You already guessed it right! Just as push() and unshift() adds elements at the end and the beginning of the array respectively, the pop() removes at the end while shift() remove elements at the beginning.

But you might want to add or remove elements at the middle or more than one element all at once. In such a case you use the splice() method. Other times you might want to copy or extract elements from an array as a new array object whereby you use the slice() method. In my next article I will explain splice() and slice() intensively.

Checking for the presence of an element with indexOf. indexOf() is quite useful when say you have mutated your array so much and aren't sure if a given element exists. It returns its index if it is found and returns -1 if the element is not found.

Remember the countries? Take a look below.

let countries = ['morocco', 'kenya', 'malawi', 'eritrea', 'ghana', 'ethiopia'];

console.log(countries.indexOf('tanzania'));

The console.log will return -1 because we do not have such a country in our array.

console.log(countries.indexOf('morocco'));

The above console.log will return 0 because that's the index of Morocco in our array.

Arrays come in handy when storing your data in a tabular form. For example a strict queue application or even your phone contacts among many other applications.

Thank you for reading, comment and let me know your thoughts and I'll see you in my next article. Bye.