Array Methods in JavaScript

Array Methods in JavaScript

Hello everyone welcome back! , In today's article, we are going to cover Array in javascript and some of its methods.

What is Array?

In JavaScript, arrays are objects. This allows us to store collections of multiple elements under a single variable name of any data type and have different methods to perform common operations on arrays. In JavaScript, arrays can be symbolized using a pair of square brackets [ ]. All array elements are separated by commas (,). We can create an array containing elements of String, Boolean, Number, or Objects.

we can create arrays in 2 ways

  1. The most preferred way to create an array

Syntax

let array_name = [item1, item2, item3,item4,.............];

Example

let fruits= ["Apple", "Banana", "Chiku", "Dragon Fruit"];
console.log(fruits);

************Output***************
['Apple', 'Banana', 'Chiku', 'Dragon Fruit']

2)Alternative way to create an array

Syntax

letarray_name = new Array("item1", "item2", "item3", "item4");

Example

let fruits = new Array("Apple", "Banana", "Chiku", "Dragon Fruit");
console.log(fruits );

************Output***************
['Apple', 'Banana', 'Chiku', 'Dragon Fruit']

What if we only want to access a certain element in an array?

This is possible with the help of indexing. So with the help of indexes, we can retrieve any element of the array. The array index starts from zero. In order to retrieve an element we need to enter the array_name followed by a square bracket and within the bracket, we need to enter the index of the element that we need to retrieve.

Example

let fruits= ["Apple", "Banana", "Chiku", "Dragon Fruit"];
console.log(fruits[0]);
console.log(fruits[1]);
console.log(fruits[2]);

************Output***************
Apple
Banana
Chiku

Array Methods

1. push()

The push method is used to add a new element at the end of the array.

Example

let fruits= ["Apple", "Banana", "Chiku", "Dragon Fruit"];
fruits.push("Edward Mango");
console.log(fruits);

************Output***************
['Apple', 'Banana', 'Chiku', 'Dragon Fruit','Edward Mango']

2. pop()

The pop method is used to delete the last element of an array

Example

let fruits= ["Apple", "Banana", "Chiku", "Dragon Fruit"];
fruits.pop();
console.log(fruits);

************Output***************
['Apple', 'Banana', 'Chiku']

3. shift()

The shift method removes the first element of the array

Example

let fruits= ["Apple", "Banana", "Chiku", "Dragon Fruit"];
fruits.shift();
console.log(fruits);

************Output***************
['Banana', 'Chiku', 'Dragon Fruit']

4. unshift()

The unshift method is used to add one or more elements at the start of the array.

Example

let fruits= ["Banana", "Chiku", "Dragon Fruit"];
fruits.unshift("Apple");
console.log(fruits);

************Output***************
['Apple','Banana', 'Chiku', 'Dragon Fruit']

5. join()

The join method creates and returns a new string by concatenating all the items in the array and these items are separated by specified separator strings or commas. And if the array has only one item then it will be returned without the separator string.

Example

let fruits= ["Apple", "Banana", "Chiku", "DragonFruit"];
let fruitsStr= fruits.join(" % ")
console.log(fruitsStr);

************Output***************
Apple % Banana % Chiku % DragonFruit

6. concat()

The concat method is used to concatenate one or more arrays to a new single array.

Example

let fruits= ["Apple", "Banana", "Chiku", "DragonFruit"];
let berries=  ["Strawberry", "Blueberry", "Raspberry", "Blackberry"];
let moreFruits = fruits.concat(berries);
console.log(moreFruits);

************Output***************
['Apple','Banana', 'Chiku', 'Dragon Fruit','Strawberry', 'Blueberry', 'Raspberry', 'Blackberry']

7. slice()

The slice method slices out some portion of an array into a new array. The source array will remain unchanged. The slice method consists of two parameters (start ,end) .

Example

let berries= ["Strawberry", "Blueberry", "Raspberry", "Blackberry"];
let newBerries = berries.slice(1,3);
console.log(newBerries);

************Output***************
['Blueberry', 'Raspberry']

8. splice()

The splice method is to add new items to an array. It consists of two parameters. The first parameter defines the index where we want to add the new element, The second parameter defines whether the elements need to be deleted or not.

Example

let berries= ["Strawberry", "Blueberry", "Raspberry"];
berries.splice(1,0, "Blackberry");
console.log(berries);

************Output***************
['Strawberry', 'Blackberry', 'Blueberry', 'Raspberry']

9. toString()

The toString method is used to convert an array into a string.

Example

let berries= ["Strawberry", "Blueberry", "Raspberry"];
console.log(berries.toString());

************Output***************
Strawberry,Blueberry,Raspberry

10. reverse()

The reverse method is used to reverse the order of the elements in the array

Example

let berries= ["Strawberry", "Blueberry", "Raspberry"];
console.log(berries.reverse());

************Output***************
[ 'Raspberry', 'Blueberry', 'Strawberry' ]

11. sort()

The sort method is used to sort the elements in the array in alphabetical order.

Example

let berries= ["Strawberry", "Blueberry", "Raspberry"];
console.log(berries.sort());

************Output***************
[ 'Blueberry', 'Raspberry',  'Strawberry' ]

12. fill()

The fill method is used to change the elements in an array from a start index to the end index.

Example

// Lets consider 3 situations
//1) change all the items to 0 from the 2nd index till the 4th index
let array1 = [1, 2, 3, 4, 5];
console.log(array1.fill(0, 2, 5));

************Output***************
[ 1, 2, 0, 0, 0 ]

//2) change the item with 5 from position 1
let array1 = [1, 2, 3, 4, 5];
console.log(array1.fill(5, 1));

************Output***************
[ 1, 5, 5, 5, 5 ]

//3) Replace all items in array with 6
let array1 = [1, 2, 3, 4, 5];
console.log(array1.fill(6));

************Output***************
[ 6, 6, 6, 6, 6 ]

13. keys()

The keys method returns a new Array Iterator object containing the keys for each index in the array.

Example

let array1 = ["a", "b", "c", "d"];
let keys = array1.keys();

for (const key of keys) {
  console.log(key);
}

************Output***************
0
1
2
3

14. includes()

The include method checks whether the array has a particular item or not and based on that returns true or false.

Example

// 1) 
let nums= [1, 2, 3];
console.log(nums.includes(2, 1));

************Output***************
true

//2)
let nums= [1, 2, 3];
console.log(nums.includes(2, 2));

************Output***************
false

15. indexOf()

The indexOf method returns the first index at which the given item can be found in an array, and if the item is not found then it will return -1.

Example

// If the item is present
let berries= ["Strawberry", "Blueberry", "Raspberry"];
console.log(berries.indexOf("Raspberry"));

************Output***************
2

// If the item is not present
let berries= ["Strawberry", "Blueberry", "Raspberry"];
console.log(berries.indexOf("Blackberry"));

************Output***************
-1

16. lastindexOf()

The lastindexOf method returns the last index at which the given item can be found in an array, and if the item is not found then it will return -1.

Example

// If the item is present
let berries= ["Strawberry", "Raspberry", "Blueberry", "Raspberry"];
console.log(berries.lastIndexOf("Raspberry"));

************Output***************
3

// If the item is not present
let berries= ["Strawberry", "Blueberry", "Raspberry"];
console.log(berries.lastIndexOf("Blackberry"));

************Output***************
-1

17. map()

This method creates a new array filled with the results of calling the provided function on each element of the calling array.

Example

let maths = [1, 4, 9, 16, 25];
console.log(maths.map(Math.sqrt));

************Output***************
[ 1, 2, 3, 4, 5 ]

Thanks for reading till the end. If you learned something then please consider liking and share among your friends. Happy Learning.