Learn JavaScript Arrays
Tags: javascript, arrays, programming, writing
Published: 2022-02-24 14:09:46

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.