Array Methods in JavaScript

Array Methods in JavaScript

In Javascript array is a data structure that contains a list of elements that store multiple values in a single variable.

Array Methods are functions built into javascript that we can apply to our arrays. Each method has a unique function that performs a change to our timing from writing common functions from scratch.

Let's Begin

Here is the list of array methods in javascript:-

Length Method :

The length method helps to know the index of the array.

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

let city = ["California", "Barcelona", "Paris", "Kathmandu"];

 find the length of the city array
let len = city.length;
console.log(len);

Output: 4

Push Method :

The push method helps to Add one or more elements to the end of an array and returns the new length of the array.

let animal = ['cat', 'dog', 'cow', 'elepnhant']

animal.push('Tiger');
console.log(animal);
the output is :- 
[ 'cat', 'dog', 'cow', 'elepnhant', 'Tiger' ]

unshift Method :

The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.

let names = ['hitesh', 'rushikesh', 'abu','saurabh'];
 names.unshift('satish', 'manik');
 console.log(names);

 output ==>  [ 'satish', 'manik', 'hitesh', 'rushikesh', 'abu', 'saurabh' ]

Slice Method :

The slice method helps when we want an element from the particular index to an index number.

Syntax:

arr.slice(begin, end)
  • begin: This parameter defines the starting index from where the portion is to be extracted. If this argument is missing then the method takes begin as 0 as it is the default start value.

  • end: This parameter is the index up to which the portion is to be extracted (excluding the end index).

Example 1 :

let names = ['hitesh', 'rushikesh', 'abu','saurabh','pandba','sachin','virat'];

console.log(names.slice(0,5));

 result : [ 'hitesh', 'rushikesh', 'abu', 'saurabh', 'pandba' ]

Splice Method :

The JavaScript Array splice() Method is an inbuilt method in JavaScript that is used to modify the contents of an array by removing the existing elements or by adding new elements.

Syntax :

Array.splice( index, remove_count, item_list )

Parameter: This method accepts many parameters some of which are described below:

index: It is a required parameter. This parameter is the index from which the modification of the array starts (with the origin at 0).

remove_count: The number of elements to be removed from the starting index.

items_list: The list of new items separated by a comma operator that is to be inserted from the starting index.

Example :

let fruit = ['apple', 'big apple', 'small apple', 'medium apple', 'grapes'];

fruit.splice(2,2, 'kharab apple', 'accha apple');

console.log(fruit);

result is =>   ['apple','big apple','kharab apple','accha apple','small apple']

Concating Array Method

The concat() method is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.

Syntax

Array.prototype.concat()

Example :

let letter = ['a', 'b', 'c', 'd'];
let num = [1,2,3];

let sum = letter.concat(num);
console.log(sum);

result ==>  ['a', 'b', 'c', 'd', 1,   2,   3 ]

Fill Method :

The Javascript arr. fill() method is used to fill the array with a given static value. The value can be used to fill the entire array or it can be used to fill a part of the array.

Syntax:

arr.fill(value, start, end)

Parameters: This method accepts three parameters as mentioned above and described below:

value: It defines the static value with which the array elements are to be replaced. start: (Optional): It defines the starting index from where the array is to be filled with the static value.

end :(Optional): This argument defines the last index up to which the array is to be filled with the static value. If this value is not defined then by default the last index of the i.e arr. length – 1 is taken as the end value.

Example:

let arr = [1,2,3,4];

   arr.fill(5);
   console.log(arr);
result is : 
[ 5, 5, 5, 5 ]

Example 2: In this example the method fill() fills the array from index 1 to 2 one less than the upper index with 87, replacing all the initial values present in the array.

 let arr = [1,23,37,45];

   arr.fill(78, 2);
   console.log(arr);
result
   [ 1, 23, 78, 78 ]

Example 3:In this example the method fill() fills the array from index 1 to 3 with 87, replacing all the initial values present in the array.

let arr = [1,23,37,45,6,78,43,87,23,89,56];

    arr.fill(78, 2,5);
    console.log(arr);

    result  
[1, 23, 78, 78, 78,78, 43, 87, 23, 89,56]

Includes Method:

The Javascript array.includes() method is used to know whether a particular element is present in the array or not and accordingly, it returns true or false i.e if the element is present, then it returns true otherwise false.

Syntax:
array.includes(searchElement, start)

Parameters: This method accepts two parameters as mentioned above and described

below: search element: This parameter holds the element which will be searched. start: This parameter is optional and it holds the starting point of the array, where to begin the search the default value is 0.

Example: In this example, we will see if a value is included in an array or not using the Array includes() method.

 var name = [ 'gfg', 'cse', 'geeks', 'portal' ];

    a = name.includes('gfg')
    console.log(a);
    Output:true

Example 2: In this example, the method will search for the element ‘cat’ in that array and returns false as ‘cat’ is not present in the array.


    var name = [ 'gfg', 'cse', 'geeks', 'portal' ];

    a = name.includes('cat')

    console.log(a);
Output:
false

Index Method :

The Index Method helps to give the index number of that value. The indexOf() method returns the first index at which a given element can be found in the array, or -1 if it is not present.

Examples:

const array = [2, 9, 9];
array.indexOf(2); // 0
array.indexOf(7); // -1

LastIndexOf() method :

The lastIndexOf() method returns the last index at which a given element can be found in the array.

Syntax: 

array.lastIndexOf(element, start)

Example:


let nam = [1,2,3,4, "anurag", 5,'anurag', 6,7, 'anurag']
console.log(nam.lastIndexOf('anurag'));

output:
9

Isarray Method:

The Javascript arr.isArray() method determines whether the value passed to this function is an array or not. This function returns true if the argument passed is an array else it returns false.

Syntax:

Array.isArray(obj)

Example:

let num = [1,2,8,9,5,7,6];
console.log(Array.isArray(num));
result ==>  true

let num1 = ('satish');
console.log(Array.isArray(num1));
result ==>  false

join() Method

The join() method returns an array as a string.

The join() method does not change the original array.

Any separator can be specified. The default is a comma (,). The array join method is used to join the elements of an array into a string

Example:

let Arr1 = [1,2,3,4,5,6,7];

console.log(Arr1.join(" satish "));
console.log(Arr1);

result ==>  1 satish 2 satish 3 satish 4 satish 5 satish 6 satish 7

Joining an array in four different ways :

const a = ["Wind", "Water", "Fire"];
a.join(); // 'Wind,Water,Fire'
a.join(", "); // 'Wind, Water, Fire'
a.join(" + "); // 'Wind + Water + Fire'
a.join(""); // 'WindWaterFire'

Map Method() :

map() creates a new array by calling a function for every array element.

map() does not execute the function for empty elements.

map() does not change the original array.

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

result ==>  [ 1, 2, 3, 4, 5 ]

Pop Method :

pop means remove something.

The pop() method removes the last element from an array and returns that value to the caller pop() to modify the Array.

Example:

let maths = [1,4,9,16,25];
console.log(maths.pop());
output : 
25
//==> remove the last element of Array

Shift Method:

The shift() method removes the first element from an array and returns that removed element. This method changes the length of the array.

Syntax :

array.shift()

    let maths = ["GFG", "Geeks", "for", "Geeks"];

console.log(maths.shift());
console.log(maths);

output: GFG
  [ 'Geeks', 'for', 'Geeks' ]

Sort Method:

The sort() sorts the elements as strings in alphabetical and ascending order.

let names = ['Hitesh Sir', 'Anurag', 'Surya', 'Anirudh', 'Bipul'];
console.log(names.sort());

output ==>   [ 'Anirudh', 'Anurag', 'Bipul', 'Hitesh Sir', 'Surya' ]

let names = ['Hitesh Sir', 'Anurag', 'Surya', 'Anirudh', 'Bipul'];
console.log(names.reverse(names.sort()));

 output ==>  [ 'Surya', 'Hitesh Sir', 'Bipul', 'Anurag', 'Anirudh' ]

Split Method:

The split() method splits a string into an array of substrings. The split() method returns the new array. The split() method does not change the original string.

 Syntax

  str.split(separator, limit)

separator: It is used to specify the character, or the regular expression, to use for splitting the string. If the separator is unspecified then the entire string becomes one single array element. limit: Defines the upper limit on the number of splits to be found in the given string.


let names = 'satish'
let array1 = names.split('');
console.log(array1);
output ==>  [ 's', 'a', 't', 'i', 's', 'h' ]

The Methods in the array are simple, just you have to practice. when you keep doing the practice of these methods with examples you will know the logic of methods.

Thank You for Reading.

##