Map, filter, and reduce are three higher-order functions in JavaScript that can be used to manipulate arrays.
Map()
the map()
function is a method that is called on an array and takes a callback function as an argument. The callback function is applied to each element in the array, and a new array is returned with the modified elements.
Here is an example of how to use the map()
function:
const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map(number => number * 2);
console.log(doubledNumbers); // [2, 4, 6, 8, 10]
In this example, the map()
function is called on the numbers
array and a callback function is passed to it as an argument. The callback function takes a single argument number
and returns the result of number
multiplied by 2
. The map()
function applies this callback function to each element in the numbers
array and returns a new array doubledNumbers
with the modified elements.
Filter()
the filter()
function is a method that is called on an array and takes a callback function as an argument. The callback function is applied to each element in the array, and a new array is returned with only the elements that pass the test implemented in the callback function.
Here is an example of how to use the filter()
function:
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // [2, 4]
In this example, the filter()
function is called on the numbers
array and a callback function is passed to it as an argument. The callback function takes a single argument number
and returns true
if number
is even (that is, if number
is divisible by 2
with no remainder) and false
otherwise. The filter()
function applies this callback function to each element in the numbers
array and returns a new array evenNumbers
with only the elements that pass the test (that is, the even numbers).
Reduce()
the reduce()
function is a method that is called on an array and takes a callback function as an argument. The callback function is applied to each element in the array, cumulatively combining them into a single value.
Here is an example of how to use the reduce()
function:
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 15
In this example, the reduce()
function is called on the numbers
array and a callback function is passed to it as an argument. The callback function takes two arguments: accumulator
and currentValue
. On each iteration of the reduce()
function, the accumulator
is updated with the result of adding it to the currentValue
. The reduce()
function also takes an optional initial value as the second argument (in this case, 0
). If an initial value is not provided, the first element in the array will be used as the initial value and the callback function will be applied to the remaining elements in the array.