["Arrays in JavaScript"]

["Arrays in JavaScript"]

Let's first understand what is array then will deep dive into its method.

So Array is an object that represents a collection of elements.

Declaration of an Array

There are basically two ways to declare array:

  • By array literal
  • By using new keyword

Syntax-

// array literal
let frameworks = ["React", "Angular", "Vue"];

// using new keyword
let frameworks = new Array("React", "Angular", "Vue");

Note - Majorly we use 1st one i.e array literal

Element of array starts at position 0 and called as index.

Array Methods

1) Length

The length property returns the number of elements in an array.

const cars = ["BMW", "Audi", "Porsche"];
cars.length; //Output: 3

2) pop()

The pop method returns the value that was "popped out". And it always pop out from end of the array.

const cars = ["BMW", "Audi", "Porsche"];
cars.pop(); //Output: Porsche

3) push()

The push method adds a new element to an array (at the end):

const cars = ["BMW", "Audi", "Porsche"];
cars.push("Ferrari"); //Output: 4
console.log(cars); // Output: ["BMW", "Audi", "Porsche", "Ferrari"]

4) Shift()

The shift method removes a first element to an array and return the value that was shifted out.

const cars = ["BMW", "Audi", "Porsche"];
cars.shift(); //Output: BMW

5) Unshift()

The unshift method add a first element to an array and return the length of the array.

const cars = ["BMW", "Audi", "Porsche"];
cars.unshift("Ferrari"); //Output: 4 as it return the length
console.log(cars); // Output: ["Ferrari", "BMW", "Audi", "Porsche"]

6) Concat()

The concat() creates a new array by merging the existing arrays.

const cars = ["BMW", "Audi", "Porsche"];
const bike = ["Honda", "TVS", "Yamaha", "Royal Enfield"]
const vehicles = cars.concat("bike"); 
console.log(vehicles); // Output: ["Ferrari", "BMW", "Audi", "Porsche", "Honda", "TVS", "Yamaha", "Royal Enfield"]

7) slice()

The slice() method slices out a piece of an array into a new array.

Note:

The slice() method creates a new array.

The slice() method does not remove any elements from the source array.

const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const newF =  fruits.slice(1);
console.log(newF); // Output: ["Orange", "Lemon", "Apple", "Mango"]

slice method can take two arguments.

const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const newF =  fruits.slice(1,3);
console.log(newF); // Output: ["Orange", "Lemon"]

8) splice()

The splice method is used to add element in array.

const fruits = ["banana", "orange", "lemon", "apple", "mango"];
const newf =  fruits.splice(2, 0, "blueberry", "grapes");
console.log(newf); // output: ["banana", "orange", "blueberry", "grapes", "lemon"]

Note - splice(2,0, "blueberry").

  • The parameter 2 defines the position at which new element should be added.
  • The parameter 0 define how many elements to be removed.
  • The 3rd parameter "blueberry" defines the new element to be added.

9) copyWithin()

The copyWithin method copies array elements to another position in the array.

const bikes = ["Honda", "TVS", "Yamaha", "Royal Enfield"]
const vehicles = bikes.copyWithin(2,0); 
console.log(vehicles); // Output: ["Honda", "TVS", "Honda", "TVS" ]

/*Onther position*/
const bikes = ["Honda", "TVS", "Yamaha", "Royal Enfield", "Bajaj"]
const vehicles = bikes.copyWithin(2,0,2); 
console.log(vehicles); // Output: ["Honda", "TVS", "Honda", "TVS", "Bajaj"]

10) toString()

The toString method is used to seprate array values into comma separated elements/ values.

const fruits = ["banana", "orange", "lemon", "apple", "mango"];
const newf =  fruits.toString();
console.log(newf); // Output: banana, orange, lemon, apple, mango

11) join()

The join method is same as to String method but in join we can contact any thing in between.

const fruits = ["banana", "orange", "lemon", "apple", "mango"];
const newf =  fruits.join(" * ");
console.log(newf); // Output: banana * orange * lemon * apple * mango

12) reverse()

The reverse method is used to reverse the element of array.

const fruits = ["banana", "orange", "lemon", "apple", "mango"];
const newf =  fruits.reverse();
console.log(newf); // Output: ["mango", "apple", "lemon", "orange", "banana"]

13) Sort()

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

const fruits = ["banana", "apple", "mango"];
const newf =  fruits.sort();
console.log(newf); // Output: ["apple", "banana", "orange"]

14) indexof()

The indexOf method is used to find the index of any element from array.

const fruits = ["banana", "apple", "mango"];
const newf =  fruits.indexOf("apple");
console.log(newf); // Output: 1

Note - If element is not exist it will return -1.

15) lastIndexOf()

The method lastIndexOf is used to find the element from the end of the array.

const fruits = ["banana", "orange", "lemon", "apple", "mango", "orange"];
const newf =  fruits.lastIndexOf("orange");
console.log(newf); // output: 5

16) includes()

The includes method returns true if an array contains a specified elements.

const fruits = ["banana", "orange", "lemon", "apple", "mango"];
fruits.includes("orange"); // Output: true

I have covered majorly all methods of array in javascript. If you found it useful please like and share with others.