CREATING AN ARRAY

We can create an array quickly, by using the Array literal notation (squared brackets).

const nums = [];

ARRAY ELEMENTS

A single value contained in an array is called an element of that array. An array can equally have a set of values (called array elements), that are separated by a comma.

const nums = [1,2];

ARRAY INDEX

An Array Index is the position of an element in an Array.

The first element in an array has an index of [0] and the last element has an index of [array.length - 1].

You can use an Array Index to target or refer to a particular array element.

const nums = [1,2];console.log( nums[0] );//1

ARRAY METHODS

Array methods are functions that allow us to perform actions directly or indirectly to an array.

To check how many elements we have in an array, we would use the length method.

const nums = [1,2];console.log( nums.length );//2

To add elements to the end of an array, we would use the push method.

const nums = [1,2];nums.push(3);console.log(nums);//1,2,3

To remove an element from the end of an array, we would use the pop method.

const nums = [1,2,3];nums.pop();console.log(nums);//1,2

To remove an element from the start of an array, we would use the shift method.

const nums = [1,2,3];nums.shift();console.log(nums);//2,3

Now the methods above allow you to add or remove elements from the start and at the end of an array. What if you want to add or remove elements from any index in an array? An array.splice() method will help us do just that.

Understanding Array.splice()

In order to use Array.splice(), you need to understand its parameters. Take a look at the code below to understand how it works

const nums = [1,2];// nums.splice(Index, Add/Remove, ...Items);

So we have:

• The first parameter to be the index of the array
• The second parameter is to add or remove items
• The third parameter is the items to add or remove

If 0 is provided as the second parameter, then you will be adding items to the array but if any number (that is not zero) is provided, that number will serve as the number of items to remove from that array starting at the specified index. This is the simplest explanation I can think of.

Let's work with some examples.

I have an array containing just one element which is a number and I want to add more elements (numbers) to it, using array.splice().

const nums = [1];

I will take note of my start index which will be the index of [1] as my first argument (this is because I want the numbers to come after the first element). Since I'm going to add to the array, I will provide 0 as the second argument and I will provide the list of numbers to add to the array as my third argument.

const nums = [1];nums.splice( 1, 0, ...[2,3,4,5] );console.log(nums);//1,2,3,4,5

Now, what if I want to remove the number 3 from the array?

I will take note of its index which is index [2] as my first argument, then since I am going to remove from the array, I will provide the number of items I want to remove starting from that index which will be just one (this is because I wish to remove just the number 3).

const nums = [1,2,3,4,5];nums.splice( 2, 1 );console.log(nums);//1,2,4,5

WORKING WITH FRUITS ARRAY

Let's try our array.splice() knowledge on another array that lists out fruits.

I have a fruit array below and I wish to add avocado as the second element after apple, how would I accomplish this task?

const fruits = ["apple","banana","mango"];

I will start by defining my start index which is at index [1] as my first argument (this is because I want to add the new fruit after the first element that has an index of [0]), then I will provide 0 as my second argument (this is because I want to add an element to the array), then I will provide the fruit I wish to add at that index as the third argument.

You will notice that array.splice() added the avocado fruit to the specified index (index of [1]) and pushed the initial elements to the right.

Now for my last example, I will delete 3 items from the start of my fruits array so that I will be left with just mango.

I will start by declaring my start index to be the index of [0] (this is because I wish to start from the beginning of the array), then the number of fruits to remove, which is 3 (so that I will be left with just mango).

I hope you've understood how array.splice() works.

Let me know if you have any questions or suggestions.

Thank you for reading.