🟨JavaScript filter()

eliminating elements of an array that do not meet a condition

Motivation

Suppose we have an array and we wish to go through its elements, then perform remove elements that do not satisfy some condition...

We could use the built-in filter() function to iterate and eliminate:

// an array of grades in a class
const grades = [72, 75, 90, 91, 92, 92, 93, 94]

// the callback function gets only "grades 90 and up"
const honors = grades.filter((grade) => grade >= 90)

console.log(grades) 
// [72, 75, 90, 91, 92, 92, 93, 94]
// i.e. the original array does not change

console.log(bellCurve)
// [90, 91, 92, 92, 93, 94]
// the filter removes any values under 90 by the return value in the callback

Addition

In addition to the current element of the iteration, the filtermethod also has two optional parameters:

• the index of the current element

• the original array showing all the elements

For example, we could provide more detail to the message logged to the console:

const grades = [72, 75, 90, 91, 92, 92, 93, 94]

const honors = grades.filter((grade, index, array) => {
    if (index === 0) console.log(`Original grades: ${array}`)
    return grade >= 90
})

console.log(honors)

Here we have to include the return statement because we have more than one line in the function!

Logging the original grades array only in the first iteration with that ifstatement, this will log:

Original grades: 72,75,90,91,92,92,93,94
> (6) [90, 91, 92, 92, 93, 94]

Summary

Remember that filter() :

• returns the values into a new array

  • the length of this array will always be equal or less than the original array

• does not modify the original array