The most important JavaScript callback function
If you start learning the javascript programming language, you should know these types of functions which are called a callback function. Today we are discussing these callback functions.
.map()
Basically accessing an array property we are using for loop & and that also good.
but javascript have a callback function which called map().Themap()
method return a new array populated with the results of calling a provided function on every element in the calling array.
const array = [10, 20, 30, 40];
const test = array.map(item => item + item);
console.log(test);
expected output: [20, 40, 60, 80]
.reduce()
When we are find out sum of nth number that’s time we are use for loop. But javascript have a callback function which called reduce(). Bassically this function use for sum of nth number..
Suppose to get and you like this…
let sum = 0;
let array1 = [2,4,5,6,7,8];
for(let i = 0; i < array1.length; i++){
sum = sum + array1[i];
}
console.log(sum);
expected output: 32
reduce function example:
const array1 = [2,4,5,6,7,8];
const result = array1.reduce((sum, index) => sum + index,0)
console.log(result);
expected output: 32
.filter()
If you have an array and you want to filter out an element from the array that’s time you can use this filter() function.
Here my data:
var pilots = [
{id: 2, name: “Wedge Antilles”, faction: “Rebels”,},
{id: 8, name: “Ciena Ree”, faction: “Empire”,},
{id: 40, name: “Iden Versio”, faction: “Empire”,},
{id: 66, name: “Thane Kyrell”, faction: “Rebels”,}
]
const test = pilots.filter(item => item.faction === “Rebels”);
console.log(test)
expected output:
[{ id: 2, name: ‘Wedge Antilles’, faction: ‘Rebels’ },
{ id: 66, name: ‘Thane Kyrell’, faction: ‘Rebels’ }]
.find()
This array method does exactly what it says: it finds what you looking for.
This array method returns the first value that’s correspondence to the passed condition. and this method reruns an object. let see an example…
var pilots = [
{id: 2, name: “Wedge Antilles”, faction: “Rebels”,},
{id: 8, name: “Ciena Ree”, faction: “Empire”,},
{id: 40, name: “Iden Versio”, faction: “Empire”,},
{id: 66, name: “Thane Kyrell”,faction: “Rebels”,}
]
const test = pilots.find(item => item.faction === “Rebels”);
console.log(test)
Expected Output:
{ id: 2, name: ‘Wedge Antilles’, faction: ‘Rebels’ }
Example 2:
var number = [10,20,30,40,50];
const test = number.find(item => item > 15);
console.log(test);
Expected Output:
20
.forEach()
forEach() this function called callback function. this take maximum three argument.
1. value of an array.
2. index of an array.
3. array object being traversing.
for example:
const number = [10,20,30,40,50];
number.forEach((item) => console.log(item) );
expected output:
10
20
30
40
50
example 2:
const number = [10,20,30,40,50];
number.forEach((item, index) => console.log(item, index) );
expected output:
10 0
20 1
30 2
40 3
50 4
.Join()
This join method returns a new string by concatening of the all element an array separated by comma.
for example:
const name = [‘Ariful’, ‘Islam’, ‘Shoriful’, ‘Khan’];
console.log(name.join())
Expected Output:
Ariful,Islam,Shoriful,Khan
.indexOf()
The indexOf method take a parameter which called index number. and this index number find the location of the searching array value.
for example:
const name = [‘Ariful’, ‘Islam’, ‘Shoriful’, ‘Khan’];
console.log(name.indexOf(‘Shoriful’));
Expected Output:
Index number: 2
example 2:
const number= [10,50,60,20,45,35];
console.log(number.indexOf(35))
Expected Output:
Index number: 5
.push()
The push method does exactly added one or more element in the end of the array.
For example:
const number = [10,50,60,20,45,35];
number.push(100);
console.log(number);
Expected Output:
[
10, 50, 60, 20,
45, 35, 100
]
Example 2:
const name = [‘Ariful’, ‘Selim’, ‘Kalam’];
name.push(‘Balam’);
console.log(name);
Expected Output:
[ ‘Ariful’, ‘Selim’, ‘Kalam’, ‘Balam’ ]
.pop()
The pop method does exactly delete one or more elements from the last point in the array.
For example:
const name = [‘Ariful’, ‘Selim’, ‘Kalam’];
name.pop();
console.log(name);
Expected Output:
[ ‘Ariful’, ‘Selim’ ]
Example 2:
const number = [10,20,30,40,60,70,5];
number.pop();
console.log(number);
Expected Output:
[ 10, 20, 30, 40, 60, 70 ]
.shift()
The shift method deletes the first element from an array.
for example:
const number = [10,20,30,40,60,70,5];
number.shift();
console.log(number);
Expected Output:
[ 20, 30, 40, 60, 70, 5 ]
Example 2:
const name = [‘Arif’, ‘Kalam’, ‘Balam’, ‘Taher’];
name.shift();
console.log(name);
Expected Output:
[ ‘Kalam’, ‘Balam’, ‘Taher’ ]