Array Methods:

filter() :

1. This method creates a new array, which is filled with the elements that pass the test implemented by the function. (or)

2. In detail - The filter() method calls a provided callbackFn function once for each element in an array, and constructs a new array of all the values for which callbackFn returns a truthy value. Array elements that do not pass the callbackFn test are not included in the new array.

3. If no elements pass the test it returns an empty array

4. It does not modify the original array.

# Syntax :

arrayName.filter( (element) => { ... } ) //or
arrayName.filter( callback-function ) //or
arrayName.filter( function(currentValue, index, arr) { ... } )

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
let newArray = arr1.filter(testFunction);
console.log(`Filtered array is ${newArray}`);

function testFunction(element) {
            return element < 15;
}

🗳️ output :

            Filtered array is 10, 14

📚 Explanation :

Tip : This picture can be related to any iterable array methods

🔍find() :

1. This method returns the value of the first element in an array that passes the test provided in the function.

2. If no value passes the test then undefined is returned

3. It does not modify the original array.

# Syntax :

arrayName.find( (element) => { ... } ) //or
arrayName.find( callback-function ) //or
arrayName.find( function(currentValue, index, arr) { ... } )

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
let newArray = arr1.find(testFunction);
console.log(`Found : ${newArray}`);

function testFunction(element) {
            return element < 15;
}

🗳️ output :

             Found : 10

findIndex() :

1. This method returns the index of the value of the first element in an array that passes the test provided in the function.

2. If no value passes the test then " -1 " is returned.

3. It does not modify the original array.

# Syntax :

arrayName.findIndex( (element) => { ... } ) //or
arrayName.findIndex( callback-function ) //or
arrayName.findIndex( function(currentValue, index, arr) { ... } )

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
let newArray = arr1.findIndex(testFunction);
console.log(`Found index of : ${newArray}`);

function testFunction(element) {
            return element < 15;
}

🗳️ output :

             Found index of : 0

🔍findLast() :

1. This method is similar to find() but it returns the value of the last element in an array that passes the test provided in the function. (or) this method searches for the value of the array in reverse order i.e., from right to left.

2. If no value passes the test then undefined is returned

3. It does not modify the original array.

# Syntax :

arrayName.findLast( (element) => { ... } ) //or
arrayName.findLast( callback-function ) //or
arrayName.findLast( function(currentValue, index, arr) { ... } )

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
let newArray = arr1.findLast(testFunction);
console.log(`Found : ${newArray}`);

function testFunction(element) {
            return element < 15;
}

🗳️ output :

             Found : 14

findLastIndex() :

1. This method is similar to findIndex() but it searches in reverse order, it returns the index of the value of the last element of an array that passes the test provided in the function.

2. If no value passes the test then " -1 " is returned.

3. It does not modify the original array.

# Syntax :

arrayName.findLastIndex( (element) => { ... } ) //or
arrayName.findLastIndex( callback-function ) //or
arrayName.findLastIndex( function(currentValue, index, arr) { ... } )

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
let newArray = arr1.findLastIndex(testFunction);
console.log(`Found index of : ${newArray}`);

function testFunction(element) {
            return element < 15;
}

🗳️ output :

             Found index of : 2

forEach() :

1. The forEach() method calls a function for each element in an array. It always returns undefined.

2. It does not modify the original array.

3. It does not even create a new array. It just iterates through the array.

# Syntax :

arrayName.forEach( (element) => { ... } ) //or
arrayName.forEach( callback-function ) //or
arrayName.forEach( function(currentValue, index, arr) { ... } )

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
arr1.forEach(testFunction);

function testFunction(element) {
         console.log(element)
}

🗳️ output :

             10
             24
             14
             16
             54
             35

from() :

1. The from() method creates a new array instance from an array-like or iterable object.

2. It returns a new array instance.

# Syntax :

Array.from(arraylike) //or
Array.from(arraylike, (element) => { ... } ) //or
Array.from(arraylike, callback-function ) //or
Array.from(arraylike, function(currentValue, index) { ... } )

</> Code eg :

console.log(Array.from("Learning"));

🗳️ output :

            [ 'L', 'e', 'a', 'r', 'n', 'i', 'n', 'g' ]

includes() :

1. This method checks whether the given value is in the array or not. If it contains in the array it returns "true" or else "false".

2. This method is case sensitive

# Syntax :

arrayName.includes(value)

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
console.log(arr1.includes(14));

🗳️ output :

             true

indexOf() :

1. The indexof() method returns the first index of an element at which the given element can be found in an array.

2. If not found it returns -1.

3. It does not modify the original array.

# Syntax :

aarayName.indexOf(value)

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
console.log(arr1.indexOf(14));

🗳️ output :

             2

isArray() :

1. This is a static method which is used to check whether the given value is array or not.

2. It returns "true" if value is Array or else "false".

# Syntax :

Array.isArray(value)

</> Code eg :

let arr1 = [ 10, 24, 14, 16, 54, 35];
Array.isArray(arr1)

🗳️ output :

             true

join() :

1. This method returns a new string by concatenating all the elements in an array.

2. In this method, we can join the elements with specified separators like an asterisk(*), hyphen (-) and space( ) etc.

# Syntax :

arrayName.join()//or
arrayName.join('-')

</> Code eg :

let arr1 = ["joining", "an", "array"];
let newArray = arr1.join();
console.log(newArray);
console.log(arr1.join("");
console.log(arr1.join(" ");

🗳️ output :

             "joining,an,array"
             "joininganarray"
             "joining an array"

keys() :

1. This method returns an array iterator that consists of keys of each element in the array

# Syntax :

arrayName.keys()

</> Code eg :

let arr1 = ["joining", "an", "array"];
let newArray = arr1.keys();
for (let i of newArray){
    console.log(i);
}

🗳️ output :

             0
             1
             2

lastIndexOf() :

1. This method returns the last index of an element in an array. It returns -1 if not found. It searches backward, starting at from index.

# Syntax :

arrayName.lastIndexOf(value)//or
arrayName.lastIndexOf(value, fromIndex)

</> Code eg :

let arr1 = ["joining", "an", "array"];
console.log(arr1.lastIndexOf("an"));

🗳️ output :

            1

map() :

1. This method returns a new Array which consists of the results of calling a provided function on every element in the calling array.

# Syntax :

arrayName.map((element, index, array) => {....})//or
arrayName.map(callbackfn) //or
arrayName.map(function (element, index, array))

</> Code eg :

let arr1 = [ 2, 3, 4, 5, 6];
console.log(arr1.map( (e) => { return e**2 });

🗳️ output :

            [ 4, 9, 16, 25, 36 ]

pop() :

1. This method removes the last element of an array and returns that element. It changes the original array.

# Syntax :

arrayName.pop()

</> Code eg :

let arr1 = [ 2, 3, 4, 5, 6 ];
console.log(arr1.pop());
console.log(arr1);

🗳️ output :

            6
            [ 2, 3, 4, 5, 6 ]

push() :

1. This method adds one or more elements to the end of an array. It changes the original array.

# Syntax :

arrayName.push(value0, value1.....)

</> Code eg :

let arr1 = [ ];
console.log(arr1.push(2, 3, 4));
console.log(arr1);

🗳️ output :

            [ 2, 3, 4]
            [ 2, 3, 4]

reduce() :

1. This method applies the user-defined function on each element of an array and the result gets accumulated and it returns only one value. This method has an initial value as an accumulator, if the initial value is not given then by default the value at the 0th index will be the initial value.

# Syntax :

arrayName.reduce( (acc, ele, i) => {.... },  initialValue);
arrayName.reduce(callback-function, initialValue);
arrayName.reduce( function (accumulator, ele, indx, arr){....}, initialvalue)

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5 ];
console.log(arr1.reduce( (acc, e) => acc + e ));

🗳️ output :

            15

reduceRight() :

1. This method works similarly to reduce() method but the only difference is it passes the elements to the function in the backward direction.

2. This method has an initial value as an accumulator, if the initial value is not given then by default the value at the last index or " length of array - 1 " index position will be the initial value.

# Syntax :

arrayName.reduceRight( (acc, ele, i) => {.... },  initialValue);
arrayName.reduceRight(callback-function, initialValue);
arrayName.reduceRight( function (accumulator, ele, indx, arr){....}, initialvalue)

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5 ];
let newArray = [];
arr1.reduceRight( (acc, e) => newArray.push(e), 0);
console.log(newArray);

🗳️ output :

            [ 5, 4, 3, 2, 1 ]

reverse() :

1. This method reverses the given string.

# Syntax :

arrayName.reverse();

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5 ];
arr1.reverse();
console.log(arr1);

🗳️ output :

            [ 5, 4, 3, 2, 1 ]

shift() :

1. This method removes the first element of an array and returns that element. It changes the original array.

# Syntax :

arrayName.shift();

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5 ];
arr1.shift();
console.log(arr1);

🗳️ output :

            [ 2, 3, 4, 5 ]

slice() :

1. This method returns a new array which is a portion of the given array whose start and end indexes are mentioned. It doesn't modify the original array.

# Syntax :

arrayName.slice(start, end);

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5 ];
arr1.slice(2, 4);
console.log(arr1);

🗳️ output :

            [ 3, 4 ]

some() :

1. This method returns "true" even if one element in the array passes the given test condition in the provided function or else it returns "false". It doesn't modify the original array.

# Syntax :

arrayName.some((element, index, array) => {....})//or
arrayName.some(callbackfn) //or
arrayName.some(function (element, index, array))

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5];
console.log(arr1.some( (e) => e%2==0 ));

🗳️ output :

            true

sort() :

1. This method arranges the elements of an array in ascending order. This method works well for alphabets but a function should be added to this method to apply it to numbers. It modifies the original array.

# Syntax :

arrayName.sort()//or
arrayName.sort( (a,b) => (a - b) ) //or

</> Code eg :

let arr1 = [ 'e', 'i', 'a', 'c'];
arr1.sort()
console.log(arr1);
let arr2 = [ 3, 1, 10, 4]
arr2.sort( (a,b) => (a - b) );
console.log(arr2)

🗳️ output :

            [ 'a', 'c', 'e', 'i' ]//sort for alphabets
            [ 1, 3, 4, 10 ];// sort for numbers

splice() :

1. This method adds the elements (i.e, items ) to an array at a given start position by deleting the mentioned delete-count no. of elements in an array. It doesn't modify the original array.

# Syntax :

arrayName.splice( start, deletecount, item1 )//or
arrayName.splice( start, deletecount, item1, ....., itemN )

</> Code eg :

let arr1 = [ 'e', 'i', 'a', 'c'];
let newArray = arr1.splice( 1, 1, 'g' );
console.log(arr1);
console.log(newArray);

🗳️ output :

            [ 'e', 'i', 'a', 'c']//orginal Array
            [ 'e', 'g', 'a', 'c']//spliced Array

toString() :

1. This method converts an array into a string which is separated by commas ( , ). It doesn't modify the original array.

# Syntax :

arrayName.toString();

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5 ];
let newArray = arr1.toString();
console.log(newArray);

🗳️ output :

            2,3,4,5

unshift() :

1. This method adds one or more elements to the beginning of an array. It changes the original array.

# Syntax :

arrayName.unshift();

</> Code eg :

let arr1 = [ 1, 2, 3, 4, 5 ];
arr1.unshift();
console.log(arr1);

🗳️ output :

            [ 2, 3, 4, 5 ]

values() :

1. This method returns an array iterator that consists of the values of each element of the given array.

# Syntax :

arrayName.values()

</> Code eg :

let arr1 = ["joining", "an", "array"];
let newArray = arr1.values();
for (let i of newArray){
    console.log(i);
}

🗳️ output :

             joining
             an
             array

Thank you for reading.