In this article, we will learn about how to use filter, find and findIndex methods of array in JavaScript. This are using to find some data from the array.
Filter:
- The filter() method is used to create a new array from a given array consisting of only those elements from the given array which satisfy a condition set by the argument method.
- Filter() doesn’t change the original array.
Syntax:
array.filter(callback(element, index, arr), thisValue)
Parameters:
- callback: This parameter holds the function to be called for each element of the array.
- element: The parameter holds the value of the elements being processed currently.
- index: This parameter optional, it holds the index of the currentValue element in the array.
- arr: This parameter optional, it holds the complete array on which Array.
- thisValue: This parameter optional, it holds the context to be passed as this to be used while executing the callback function. If the context is passed, it will be used like this for each invocation of the callback function, otherwise undefined is used as default.
Example:
<html>
<body>
<button >
Find:
- The find() method is used to get the value of the first element in the array that satisfies the provided condition.
Syntax:
array.find(callback(value,index,arr),thisArg)
Parameters:
- callback: It is the function of the array that works on each element.
- value: The current element of an array.
- index: The index of current element. It is optional.
- arr: It is an optional parameter that holds the array object the current element belongs to.
- thisArg: It is optional. The value to use as this while executing callback.
Example:
<html>
<body>
<button >
FindIndex:
- The findIndex() method returns index of first element of the given array that satisfies the provided function condition.
Syntax:
array.findIndex(callback(value,index,arr),thisArg)
Parameters:
- callback: It is the function of the array that works on each element.
- value: The current element of an array.
- index: The index of current element. It is optional.
- arr: It is an optional parameter that hold the array object the current elements belong to.
- thisArg: This parameter optional, it holds the context to be passed as this to be used while executing the callback function. If the context is passed, it will be used like this for each invocation of the callback function, otherwise undefined is used as default.
Example:
<script>
var ages = [56, 60, 35, 78, 89];
function checkSeniorCitizon(age) {
return age >= 60
}
function filterAge() {
document.getElementById('agefilter').innerHTML = ages.filter(checkSeniorCitizone);
}
</script>