If you did some front-end development, you’re probably familiar with Object-Oriented Programming, even if you don’t know it. Many JS libraries are exposing classes, which can be instantiated to describe the desired effect, like this:

const waypoint = new Waypoint({

element: document.getElementById('thing'),

handler: () => console.log('You have scrolled to a thing')

})

JavaScript is mostly used in an OO way, but nothing prevents us from using it in a functional way. Let’s see how the two would differ.

But first, a disclaimer: I know FP vs. OOP is a broad, nuanced, and sometimes fuzzy subject. What follows is a slight simplification of a perhaps false dichotomy. Nevertheless, I think that front-end development can benefit greatly from FP influences.

Functional vs. Object-Oriented

Let’s start with a lightweight argument in favour of functional programming:

I wanted to introduce some balance here, but the argument against functional programming seems to be that it’s just… hard. However that’s understandable — even the terms themselves sound cryptic: Monads, Functors, Monoids, and all other mathematical jargon may turn a lot of people away. Haskell, a purely functional language, is famous for being hard to grasp.

But you don’t have to switch to a purely functional language to write functional code. A “functional” language just means that the language was designed with functional paradigm in mind. JavaScript can be functional if you want it to.