Learn Hard the Code Way: Functional Programming

Using JavaScript!

Last week I showed you how to use abstraction to concatenate numbers in JavaScript and celebrated my 12th wedding anniversary! Even though we are no longer together, it’s always nice to remember the good times and enjoy a glass of champagne while crushing code alone on a cold, dead winter’s night.

Let’s talk about language paradigms.

A lot of developers who dive into JavaScript are coming from an object-oriented background, if any at all. They are used to imperative languages like Java and PHP, where instructions can change state and allow mutable data. Then there are the non-JavaScript developers who abhor anything non-functional; they rave about Haskell, Erlang, and theoretical/made-up maths like “lambda calculus”. What these “functional” programmers do not realize is that JavaScript is multi-paradigm. It can be all the things!

Now, this is great and all, but it also means JavaScript developers need to choose a paradigm when sitting down to code it. So, what is the ultimate best paradigm for JavaScript: object-oriented? Imperative?

Much like a marriage, JavaScript is so much better when it is functional.

In functional languages, instructions cannot change things, which is good and makes things less complicated — kind of like when you make a commitment to someone who acts a certain way and they don’t change on you six months into the marriage or say you’ve changed when really you haven’t. People do change, though, which is why it’s hard for us to grasp the idea of functional programming versus imperative. Hopefully I can make it easy to understand here.

How do we make JavaScript functional?

Any language is completely functional when literally every instruction in the program is a function call. And the best way to understand this is to take an imperative JavaScript program and functionalize it. Today we are going to build a simple calculator that can only add and subtract.

// IMPERATIVE javascript calculator
var result;
var add = function(num1, num2){
  result = num1 + num2;
  return result;
};
var subtract = function(num1, num2){
  result = num1 - num2;
  return result;
};

So this program has 7 lines of code: declaring a `result` variable, declaring `add` and `subtract` functions, and two instructions within those functions for calculating result and returning it. In order to make this a functional program, we need to make every line a function.

// FUNCTIONAL javascript calculator
// var result;
var add = function(num1, num2){
  result = num1 + num2;
  return result;
};
var subtract = function(num1, num2){
  result = num1 - num2;
  return result;
};

For one, we can comment out the `result` declaration because I don’t know how that can be a function so we probably don’t need it. But this also means we cannot have `result` returned in our functions, so we need to reflect that.

// FUNCTIONAL javascript calculator
// var result;
var add = function(num1, num2){
 return num1 + num2;
};
var subtract = function(num1, num2){
  return num1 - num2;
};

Half of our code is functional at this point, so we can remove white space to make two functional lines. We also need to remove all comments and blank lines since those are not functions.

var add = function(num1, num2){ return num1 + num2; };
var subtract = function(num1, num2){ return num1 - num2;};

So there we go, a functional add/subtract calculator in JavaScript!

It should also be pointed out that a great consequence of converting this to a functional program is that there are fewer lines, which means fewer instructions, which therefore means a faster execution at runtime. Speed was the reason why detractors of the language tend to steer clear, but after reading this, we should hope they realize the beauty and speed they are missing out on.

Jenn Schiffer is a dysfunctional JavaScript developer.