Practical introduction to Functional Programming with JS

Higher Order Functions

Higher Order Functions are functions that take other functions as parameters, Mind Blown 💥.
We are going to discover how these functions are useful through some examples; in particular, we are going to recreate the logic of the Amazon checkout.

Filter

Filter is a method of arrays. It accepts as argument a test function which should return a boolean, and returns a new array with only the elements for which the test function returned true.

Here is an example:

As you can see, the function isEven doesn't need to include the logic to handle arrays. This is the great thing about higher order functions: the decision logic is kept separate from the function applying it, so we can reuse it.

Let's try to implement our first piece of logic for the amazon cart: extracting from the cart array all the prime items

Reject

We can now reuse the isPrime function in conjunction with reject to get all the non-prime items in the cart. The reject function is the opposite of the filter: it creates an array with all the elements but those that satisfy the condition.

Reject is not a built-in function in js, we are going to use the library underscore.js to have it. The syntax is slightly different: _.reject(list, testFunction) where _ is the underscore library

As an optional exercise, you could also implement reject yourself using filter.

Lambda functions

When defining short functions, it's often convenient to use an alternative syntax called lambda function that allows us to define anonymous functions in a more compact way: ( /*arguments*/ ) => { /*code*/ }. If our function is only a return statement, we can even strip the curly brackets and avoid writing return: ( /*arguments*/ ) => /*value to return*/.

We can rewrite the isEven snippet from before with a lambda function:

Map

Another very useful higher order function is map: it takes a function and applies it to all the elements of an array.
The syntax is identical to filter
E.g.

Now back to our amazon example: we can use map to apply a coupon. The applyCoupon function should apply a 20% discount on all the tech items.

Reduce: one function to rule them all

Reduce is the last higher order function we are going to discuss and it's also the most powerful: in fact, you can implement any list transformation with reduce.
Reduce takes in a callback function and a starting value, the callback function takes as arguments an accumulator and the value of the current element of the array and returns the accumulator to be used in the next cycle. The value returned from the last call of the callback function is the value returned by reduce.

It's easier if I show you some examples:

Now to complete our amazon workflow, write a function that returns the total cost of the order.