# Functional Basics #2: Filter

Welcome back! In the second part of this mini-series on functional programming basics, I'll be taking a quick look at another common array function - `filter`.

If you haven't already read it, I recommend starting with the first article in this series, Functional Basics #1: Map. I'll be building on some ideas as the series progresses.

### What is it?

Let's again start by defining what `filter` does: it takes an array and removes some elements, leaving only the elements that we're interested in. Okay, but how does it do that? We'll first take a look at how we'd do it in the imperative style, using `for` loops:

``````const myArray = [1, 2, 3, 4, 5]
let oddNumbers = []

for (let i = 0; i < myArray.length; i++) {
if (myArray[i] % 2 === 1) {
oddNumbers.push(myArray[i])
}
}

// myArray: [1, 2, 3, 4, 5]
// oddNumbers: [1, 3, 5]
``````

As we did with `map` in Part 1, we can tidy this up by extracting some of the logic from our loop - specifically, we can extract the condition of the `if` statement to make it clear what that condition actually means:

``````const isOdd = num => num % 2 === 1

const myArray = [1, 2, 3, 4, 5]
let oddNumbers = []

for (let i = 0; i < myArray.length; i++) {
if (isOdd(myArray[i])) {
oddNumbers.push(myArray[i])
}
}

// isOdd(1): true
// isOdd(2): false
// myArray: [1, 2, 3, 4, 5]
// oddNumbers: [1, 3, 5]
``````

Having extracted the logic to an `isOdd` function, you can now see clearly that we're checking for odd numbers in our `if` statement.

A function like `isOdd` which determines whether a value meets a certain criteria is known as a predicate function.

But we still have a `for` loop which is a potential opportunity to introduce bugs, and we still have to mutate our `oddNumbers` array by adding results to it one by one.

If we try to describe what we want in a declarative way, we could say, "take `myArray` and produce a new array which only contains the elements for which `isOdd` is true". And `filter` allows us to express exactly that:

``````const isOdd = num => num % 2 === 1

const myArray = [1, 2, 3, 4, 5]

const oddNumbers = myArray.filter(isOdd)

// myArray: [1, 2, 3, 4, 5]
// oddNumbers: [1, 3, 5]
``````

Calling `filter` on an array, and passing it a predicate function, returns a new array containing the elements for which the predicate returns `true`.
Also note the original array is not mutated by `filter` - as with `map`, the result must be assigned to a variable or used immediately!

Also, as with `map`, we're not restricted to using our own functions as the predicate. We can use any function which takes one value and returns `true` or `false`. Javascript has a global function `isNaN` which returns `true` if the value passed to it is not a number, and `false` if it is. Let's use that to filter out numbers from an array:

``````const myArray = [1, 2, 'apple', 3, 'orange', 4, 'banana']

const arrayWithoutNumbers = myArray.filter(isNaN)

// myArray: [1, 2, 'apple', 3, 'orange', 4, 'banana']
// arrayWithoutNumbers: ['apple', 'orange', 'banana']
``````

And that pretty much sums it up for `filter`. Again, aside from looking specifically at `filter`, it's important to reinforce the idea that functions are just values which can be passed to and returned from other functions, like any other value. Stay tuned for Part 3!

If you found this article helpful, follow me! I'll be adding more articles in this series soon. Liked it? Like it ❤️! Suggestions/improvements? Comment ⬇️! :)