Send More Paramedics

Fun.js – Functional JavaScript

May 29, 2013

I’ve written a book entitled Functional JavaScript due out in print sometime in June 2013. In the book I introduce and explore various techniques for writing code in a functional style using the Underscore library. As much as I would have loved to delve into the ecosystem of functional JS libraries, I didn’t want to distract from the core functional topics in the book.¹ Therefore, I present a series to explore a few of my favorite functional JavaScript libraries² focusing primarily on the feature(s) that make them interesting, innovative or unique.³

Functional JavaScript

Oliver Steele’s Functional JavaScript library is the first functional library that I discovered; about 4-5 years ago.⁴ It provides all of the normal higher-order functions like map, reduce and filter. For example, to square the numbers in an array one would normally write the following:

function square(n) { return n * n }

map(square, [1, 2, 3, 4]);
//=> [1, 4, 9, 16]

This is known technology by now, but at the time of its release, Functional JavaScript was fostering a style of programming that hadn’t gained a foothold in the larger JavaScript community.⁵

However, something that Functional JavaScript provided, that to this day has not been fully leveraged⁶ are its deliciously insane (in a good way) lambda string literals. Using the string lambda feature the same code as above can be written as:

map('n*n', [1, 2, 3, 4]); 
//=> [1, 4, 9, 16]

So as you’ll notice, the whole square function was replaced by the string 'n*n'. The mechanism behind this mojo is pretty interesting to read, so I highly advise studying it deeply to see some true JS-wizardry in action.

In a nutshell, the string lambda is parsed into a string format representing a function’s parameters and body text and passed on to the Function constructor to build a real-life function. The Functional JavaScript core functions will build real functions from string lambdas whenever they’re given a string where a function argument is expected. The one downside of using the string lambda form is that it does not create a closure. Observe that the following code uses a closure to scale an array:

function scale(a, m) { 
  return map(function(n) { return n*m }, a);
}

scale([1,2,3], 10);

//=> [10,20,30]

In short, the m argument is captured by the inner function passed to map and used as the scale factor. The follow, using a string lambda does not build a closure:

function scale(a, m) { 
  return map('n*m', a) ;
}

scale([1,2,3], 10);

//=> [0,2,6]

That’s weird. How did it get those numbers?

The problem is that since a closure cannot be created,⁷ Functional JavaScript just parses and sets m as another parameter thus building a 2-arg function that is called on every element in the array. As you might have guessed, Functional JavaScript does the same thing as Array#map. That is, when the 2-arg function is called the second argument m is assigned the array index of the current element. Therefore, the actual calculations occurring are:

1*0 //=> 0
2*1 //=> 2
3*2 //=> 6

I could murder that Array#map.

My favorite feature of Functional JavaScript is the interplay between currying and the string lambdas, shown below:

var lessThan5 = rcurry('<', 5);

lessThan5(4); 
//=> true

lessThan5(44); 
//=> false

I’ll cover currying in a later post, but it’s very interesting how the string lambda and currying interoperate to provide very succinct code.

Functional JavaScript is a masterful piece of JavaScript meta-programming⁸ and well worth exploring for its technical insights alone.

Enjoy.

If you want to talk functional programming, my book, the library in question or anything else then feel free to comment below or email me at the address at the top of this blog post.

:F