The filter() method is a built-in function in JavaScript that operates on arrays. It creates a new array with all elements that pass the test implemented by the provided function. The syntax for filter() is as follows:
Here, array is the array on which the filter() method is being called. The function argument is a callback function that will be called once for each element in the array, and its return value will determine whether the element is included in the new array or not.
The currentValue argument is the current element being processed in the array, while the index argument is the index of that element, and the arr argument is the array itself. The thisValue argument is optional, and is the value to be used as this when executing the callback function.
Here is an example of using filter() to filter out even numbers from an array:
In this example, the filter() method is used to create a new array called oddNumbers that only contains the odd numbers from the original array numbers. The callback function checks if the remainder of num divided by 2 is not equal to 0, which means that num is an odd number, and returns true for odd numbers, and false for even numbers.
Here's an example of using the filter() method to create a new array of numbers greater than 5:
In this example, the filter() method is called on the numbers array. The callback function checks if each element in the array is greater than 5. If it is, the element is included in the new filteredNumbers array. Finally, the new array is logged to the console.
const numbers = [2, 4, 6, 8, 10]; const filteredNumbers = numbers.filter((number) => number > 5); console.log(filteredNumbers); // Output: [6, 8, 10]
In each of these examples, the filter() method is called on an array and passed a callback function. The callback function determines whether or not an element should be included in the new array. If the callback function returns true, the element is included in the new array, and if it returns false, the element is excluded.
Filtering an array of objects based on multiple criteria:
const people = [ { name: 'John', age: 25, gender: 'male' }, { name: 'Jane', age: 30, gender: 'female' }, { name: 'Bob', age: 35, gender: 'male' }, { name: 'Alice', age: 28, gender: 'female' }, ]; const filteredPeople = people.filter(person => person.gender === 'male' && person.age > 30); console.log(filteredPeople); // Output: [{ name: 'Bob', age: 35, gender: 'male' }] // Filtering numbers in an array that are greater than 10: const numbers = [5, 10, 15, 20, 25]; const filteredNumbers = numbers.filter(number => number > 10); console.log(filteredNumbers); // Output: [15, 20, 25] //Filtering strings in an array that contain a specific substring: const strings = ['apple', 'banana', 'pear', 'pineapple']; const filteredStrings = strings.filter(string => string.includes('apple')); console.log(filteredStrings); // Output: ['apple', 'pineapple']
Filtering objects in an array based on a property value:
const products = [ { name: 'iPhone', price: 999 }, { name: 'iPad', price: 699 }, { name: 'Macbook', price: 1299 }, { name: 'AirPods', price: 159 }, ]; const filteredProducts = products.filter(product => product.price > 500); console.log(filteredProducts); // Output: [{ name: 'iPhone', price: 999 }, //{ name: 'iPad', price: 699 }, // { name: 'Macbook', price: 1299 }]