There are a lot of methods which does not necessarily known to all developers .However,code complexity can be reduced in order to make the code perfect with the help of applying methods in coding.The reason which makes it difficult for few people to comprehend the correct functionality of the methods are due to these reasons, Have to spend a lot of time to read and understand ,Some explanations might be complicated, some methods performs some what similar functions so it's difficult in understanding the correct requirement of the methods etc... Here in this blog i've explained the array methods with simple definition and simple examples, please feel free to check it out.....
This methods helps to iterate over the elements in the array.This property returns a function and when the function is called its gonna return an iterator.
const a=[1,2,3,4];
let b= a[Symbol.iterator]();
console.log(b.next());
console.log(b.next());
console.log(b.next());
console.log(b.next());
console.log(b.next());Result:-
{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: 4, done: false }
{ value: undefined, done: true }value:-Element in the array
Done:-weather the loop is finished or not
This method is used to merge two arrays, and returns a new array.
const a=[1,1,2,3,];
const b=[1,4,5,6];
const c=a.concat(b);
console.log(c);Result:-
[
1, 1, 2, 3,
1, 4, 5, 6
]Here all the elments from the start point to the end point are replaced by the value ,the array length remains the same.
const a = [0,1,2,3,4,5,6];
console.log(a.fill(9,2,5));Result:-
[
0, 1, 9, 9,
9, 5, 6
]In this method the elments from the start pont upto the end point are been copied to the target point, this method returns the same array without modifying the length .
const a=[1,1,2,3,4,5,6];
console.log(a.copyWithin(0, 3, 7));Result:-
[
3, 4, 5, 6,
4, 5, 6
]Here in this example the target point is 0(1),starting point 3(3) and ending point 7(it takes the value in the 6th index position ,so 6 )
This method which returns a new array which has been iterated , the obeject with the array will be having a key value pair .The key is the index and the value is the element in the array.
const a=["a","b","c"];
const b=a.entries();
console.log(b.next());
console.log(b.next().value);
console.log(b.next());
console.log(b.next());Result:-
{ value: [ 0, 'a' ], done: false }
[ 1, 'b' ]
{ value: [ 2, 'c' ], done: false }
{ value: undefined, done: true }It checks whether all elements in the array satisfy the condition inside the function.Returns a boolean
const a = (currentValue) => currentValue < 4;
const c = (currentValue) => currentValue < 10;
const b=[1,2,3,4,5,6,7];
console.log(b.every(a));
console.log(b.every(c));Result:-
false
true.filter method returns a new array of elements that have passed the condtion declared inside the filter.
const a = [0,1,2,3,4,5,6];
const c = (currentValue) => currentValue < 4;
const d=a.filter(c);
console.log(d);Result:-
[ 0, 1, 2, 3 ].find() returns the first element in the array that satisfies the condition that have been discribed inside the .find method.Returns undefined if elemnent satisfy the condition.
const a = [0,1,2,3,4,5,6];
const c = (currentValue) => currentValue < 4;
const d=a.find(c);
console.log(d);Result:-
0Returns the index of the first element which satisfies the condition
const a = [0,1,2,3,4,3,8,5,6];
const c = (currentValue) => currentValue > 4;
const d=a.findIndex(c);
const f=a.find(c);
console.log(d);
console.log(f);
Result:-
6
8.flat returns a new array with the sub array depth been decreased upto the specified value, wecan't increase the the depth using .flat method.
const a= [0, 1, 2, [[[3, 4]]]];
console.log(a.flat());
console.log(a.flat(1));
console.log(a.flat(2));
console.log(a.flat(3));Result:-
[ 0, 1, 2, [ [ 3, 4 ] ] ]
[ 0, 1, 2, [ [ 3, 4 ] ] ]
[ 0, 1, 2, [ 3, 4 ] ]
[ 0, 1, 2, 3, 4 ]It is a combination of flat and map methods. Performs the operation on all the elements inside the array and increase the depth of the new array
let a = [0,1,2,3,4,3,8,5,6];
console.log(a.flatMap(x => [[x * 2]]));
console.log(a.flatMap(x => [[[x * 2]]]));Result:-
[
[ 0 ], [ 2 ],
[ 4 ], [ 6 ],
[ 8 ], [ 6 ],
[ 16 ], [ 10 ],
[ 12 ]
]
[
[ [ 0 ] ], [ [ 2 ] ],
[ [ 4 ] ], [ [ 6 ] ],
[ [ 8 ] ], [ [ 6 ] ],
[ [ 16 ] ], [ [ 10 ] ],
[ [ 12 ] ]
]Perform an action over all the elements inside an array,and returns the element.
const a = [0,1,2,3,4,3,8,5,6];
let c=a.forEach(element => console.log(element*2));Result:-
0
2
4
6
8
6
16
10
12Checks whether an element is present inside the array or not,returns true or false
const a = [0,1,2,3,4,3,8,5,6];
console.log(a.includes(10));
console.log(a.includes(2));Result:-
false
trueReturns the index where the element is present , return -1 if not found.
const a = [0,1,2,3,4,3,8,5,6];
console.log(a.indexOf(10));
console.log(a.indexOf(2));Result:-
-1
2 checks whether an array or not, returns true or false.
const a = [0,1,2,3,4,3,8,5,6];
const car = {type:"Fiat", model:"500", color:"white"};
console.log(Array.isArray(a));
console.log(Array.isArray(car));Result:-
true
falseReturn a new string with the elements in the array which are separated specified separator.
const a = [0,1,2,3,4,3,8,5,6];
console.log(a.join());
console.log(a.join('+'));
console.log(a.join('-'));Result:-
0,1,2,3,4,3,8,5,6
0+1+2+3+4+3+8+5+6
0-1-2-3-4-3-8-5-6Act kind of an Iterator function, which return the index of the key.
const array1 = ['a', 'b', 'c'];
const b = array1.keys();
console.log(b.next());
console.log(b.next());
console.log(b.next());
console.log(b.next());Result:-
{ value: 0, done: false }
{ value: 1, done: false }
{ value: 2, done: false }
{ value: undefined, done: true }Returns the last found index of the searched element in the array,returns -1 is not found.
const a=[1,2,3,4,5,1,1,4,5,6,6]
console.log(a.lastIndexOf(1));
console.log(a.lastIndexOf(0));Result:-
6
-1Performs the operation over all the elements in the array and returns a new array.
const a = [0,1,2,3,4,];
let c=a.map(element => (element*2));
console.log(c);Result:-
[ 0, 2, 4, 6, 8 ]creates an array.
const a= Array.of(0,1,2,3,4);
const b= Array.of("cat","dog","snake");
console.log(a);
console.log(b);Result:-
[ 0, 1, 2, 3, 4 ]
[ 'cat', 'dog', 'snake' ]removes and return the last element.Changes the length of the array.
const a= Array.of(0,1,2,3,4);
console.log(a);
console.log(a.pop());
console.log(a.pop());
console.log(a.pop());
console.log(a.pop());
console.log(a.pop());Result:-
[ 0, 1, 2, 3, 4 ]
4
3
2
1
0Add a new element to the end of the array. Changes the length of array.
const a= Array.of(0,1,2,3,4);
console.log(a);
a.push("a");
a.push("b");
console.log(a);Result:-
[ 0, 1, 2, 3, 4 ]
[
0, 1, 2, 3,
4, 'a', 'b'
]Takes two elements and perform an action, the action is again performed with the result and the next element .This process is repeated until the last element has been reached .
const a = [1, 2, 3, 4];
const res = (previousValue, currentValue) => previousValue + currentValue;
console.log(a.reduce(res));Result:-
10Takes two elements the last position and perform an action, the action is again performed with the result and the next element .This process is repeated until the first element has been reached . Same as reduce but in reduce its left to right how the operation is performed but in reduce right its form right to left
const a = [10,4,2,1];
const res = (previousValue, currentValue) => previousValue-currentValue;
console.log(a.reduce(res));
console.log(a.reduceRight(res));Result:-
3
-15Reverse the array,The first element becomes the last element and vice versa.
const a = [0,1,2,3,4,5]
console.log(a.reverse());Result:-
[ 5, 4, 3, 2, 1, 0 ]Returns the first element in the array.Changes the length of the array.
const a = [0,1,2,3,4,5]
console.log(a.shift());
console.log(a.shift());Result:-
0
1Slice the array from the start index to the end index mentioned in the slice method.The orginal array remains the same.
const a = [0,1,2,3,4,5]
console.log(a.slice(1,3));
console.log(a);Result:-
[ 1, 2 ]
[ 0, 1, 2, 3, 4, 5 ]Checks whether at least one element satisfies the condition.Return true or false.
const a = [1, 2, 3, 4, 5];
const greater= (element) => element>4;
const greatest= (element) => element>7;
console.log(a.some(greater));
console.log(a.some(greatest));Result:-
true
falseThe elements are sorted in a special manner.
const a = ["dog","cat","lion","snake"];
console.log(a.sort());Result:-
[ 'cat', 'dog', 'lion', 'snake' ]The sorting is done in such a manner that the elements first letters are considerd.C comes first then d the l the s, since such a result.
In splice the item is added to the start index .The deletecount index determines the element to be deleted.
const a = ["dog","cat","lion","snake"];
a.splice(1,0,'crow')
console.log(a); Result:-
[ 'dog', 'crow', 'cat', 'lion', 'snake' ]Converts the array to a string
const a = ["dog","cat","lion","snake"];
const b=a.toString()
console.log(b);Result:-
dog,cat,lion,snakeAdd elements to start of the array. changes the length of the array.
const a = ["dog","cat","lion","snake"];
a.unshift(1,2,3,4);
console.log(a);Result:-
[ 1, 2, 3, 4, 'dog', 'cat', 'lion', 'snake' ]Act as an iterator funtion that returns each value in the array.
const a = ["dog","cat","lion","snake"];
let b=a.values();
console.log(b.next().value);
console.log(b.next().value);
console.log(b.next().value);Result:-
dog
cat
lion