Functional Programming with Javascript | Introduction

You might have heard that there are some developers talking about how cool functional programming is. Robert C Martin (also known as Uncle Bob and is a world-famous developer) predicts functional programming is the future in some of his presentations.

So, I think it’s worth exploring functional programming concepts. Some pure functional programming languages are Clojure, Haskell, etc.

In this post, you will learn:

1. What is functional programming?

2. Why functional programming with Javascript?

3. Functional programming concepts with Javascript.

4. Comparing Imperative Vs Object-Oriented Vs Functional Programming Paradigms.

What is Functional Programming?

Functional Programming is a paradigm or style to structure your code in a functional way, meaning you use functions for everything. In a functional programming paradigm, functions are the king.

We can write functional programming with vanilla JavaScript because JavaScript is very flexible when it comes to using different paradigms.

Why Functional Programming?

There are other paradigms such as Imperative and Object-Oriented that you might think would be better. However, I think Imperative is a very step-by-step approach and could cause a lot of global scoping and readability issues.

On the other hand, working with Object-Oriented Javascript is sometimes tricky and confusing especially when it comes to dealing with “this” and “bind” keywords. Things could be simpler, and that is where functional programming comes to the rescue.

Most of the time, adding a functional programming structure can make your code more maintainable and readable as your project is getting larger.

It does not mean that other paradigms are completely bad.

Each one has its own pros and cons. However, thinking of a functional way would help your code, which will likely have some bugs or errors, be more elegant or easy to understand. I hope you’re convinced now that functional programming has some interesting concepts to learn.

Functional Programming Concepts with Javascript

Everything you write should be inside a function literal. Functions are values and can be assigned to variables like Strings, Ints etc.

Normally, you can declare a function and invoke it after in many different languages similar to the code below:

function rootSquare(num) {
 return num * num;
}
var result = rootSquare(8) ;
console.log(result); // 64

In Javascript, you can write an anonymous function like the one below. In this code example, you can assign a function literal to a variable and use it wherever you want. This can only be done in Javascript. Now you know how functions can be written in Javascript in different ways.

var rootSquare = function(num) {
 return num * num;
}
var result = rootSquare;
var result1 = result(9)
console.log(result1); // 81

Always write pure functions. Pure functions take an input and compute something and then return either a value or another function. Pure functions should do just that.

If the function is using the variable that is declared outside of the function block to compute something to return, that function is not considered a pure function. We can avoid the side effect of worrying about the changing state of any variable.

Abstract functions in your code. Decouple your functions as much as possible in order to reuse the function anywhere in your code.

Higher-order functions are the functions that return other functions and compose small functions together in order to make a bigger function that does exactly what you want that function to return.

Always use higher-order functions instead of integrating a list using “for”. There are a few array object methods in Javascript such as Map, Filter, Reduce etc. Before using them, I want to show the customized higher-order function in the code sample below.

function composeName(firstName) {
    return function(lastName) {
        return firstName + " " + lastName;
    }
}

var yourFirstName = composeName("Ramu");
var yourFullName = yourFirstName("Sundar");

console.log(yourFullName); // Ramu Sundar

If you want to know more about higher-order functions, check out my other article Functional Programming with Javascript | Higher-Order Functions.

Always make immutable variables. You can achieve this by having a persistence data structure using Mori or immutable.js libraries to open the features such as linked list, trees, path dealing to help with efficiency. I will not be covering how to create a persistence data structure using those libraries as it’s not the scope of this post.

Comparing Imperative Vs Object-Oriented Vs Functional Programming Paradigms

Continue Reading...