The Kung Fu of HOF

A junior developer meets higher order functions in JavaScript

Reed Meher

10/9/20237 min read

Kung Fu means research, learning, and practice. Kung Fu requires patience, energy, and time. Kung Fu is discipline, and it doesn’t solely refer to martial arts, but anything that needs mastery. Higher Order Functions, HOF, are one of the principles of JavaScript that needs serious Kung Fu for mastery.

When I came to really grasp the depth, scope, and flexibility of HOF (AKA first sensed the Kung Fu needed for HOF), it was a few months after I completed a full stack boot camp. I met a veteran JavaScript developer through a Meetup group who was looking to recruit someone for his development team at a pretty big education company. We met over a Discord call to talk about the position.

Turns out they were looking for a senior level developer, but had been striking out for months to get one on board. The developer, let’s call him King, asked if I was versed in DevOps. I’d heard the term a lot in the last year, but didn’t really have any idea what the hell it was, even though I’d tried to research it a few times with a lot of mixed answers. I wouldn’t learn until much later that, if HOF needs Kung Fu, well, then DevOps need austere Zen practice.

Anyway, I hadn’t the foggiest fuck what DevOps was back then, but I was hungry, eager, and needed work so I’d have some income for all the hours I was spending coding. So I replied, “No, but I can learn it”. King laughed. He didn’t know how bad I had to turn these code blocks into gold blocks. Three daughters have to eat, and my wife and I were about out of champagne.

Of course, I didn’t know how naive I sounded either. I can learn DevOps? Just give me the job, coach. I know what a ball is and how to kick it, so put me on Santos FC. That’s all Pele knew about football when he got the job, right? Sheesh, I was fresh.

Anyway, I digress. King gave me a take-home coding challenge. All I had to do, he said, was write a function. That function needed to take in at least one function as an argument and return a new function that was a composition of the arguments. He even gave me a nice example:

compose(x=> x-1, x=> x*2, x=> x + ‘s’)(10)
// should return ‘18s’

Being green as a baby bean, I was overjoyed. This is some easy coding right here, I thought. Any of you experienced developers out there who perchance are reading this, you can imagine that I was about to struggle. And struggle I did. Trying to show off my flair, I sent King some pretty outrageous functions that took a long time, and a lot of steps, to do some basic things. It can only be compared to the rubbish you get when you ask a suburban teenager to write poetry for the first time and they’ve only read Shakespeare and Ed Sheeran lyrics. Oh, don’t get me wrong, Shakespeare and Sheeran are great, but teenagers writing poems when they think it’s easy because they’ve read great things?

I wanted to know
But you were cold
I couldn’t remember
Why
Crying, crying,
Cried.
I screamed.

Need I continue? That is the poetry equivalent of the code I sent King. He was patient. “That’s a good start, but it doesn’t really meet any of the criteria…” And I asked leading questions because I thought he’d concealed details from me. I didn’t know how much I didn’t know, you know?

I gave him a few batches of bad poetry code before I stopped and took stock. Why did I wait so long to take stock? Young developers: always stop and take stock FIRST. I know you won’t, but we all say it anyway, even though we all have to learn the hard way. There is value in the brash, blind coding, too, as long as you are willing to acknowledge it for what it is and know when to quit.

I figured out when to quit. Not quit the challenge, but quit trying to write code like I invented it. I researched, hallelujah. Research, the sweet chocolate cake of the weary coder. Research, the balm for coding hubris. Research, the first step to Kung Fu.

I figured out that what King was asking me to do was to write a higher order function. I dug deep into the world of HOF. It’s a deep world. It twisted my brain. I felt like Trinity had left me a white rabbit. I was deep in closures and recursion. I hadn’t solved the challenge yet, and weeks had passed. I didn’t care about the job anymore, I mean, I needed it, but it wasn’t on my mind. I wanted to know how to solve the challenge. And I didn’t want to do it with a lot of flourish and pomp. No bad poetry code. I wanted code that was clean and simple to look at but difficult to conceive. Code like the HOF principles I was studying.

After about three weeks, King told me I was so close. I told him I had to throw in the towel. My heart was heavy.

I told King, “I can’t figure out an algorithm that will nest the answer from one function and pass it on to the next, etcetera, when you don’t know beforehand how many functions you’ll be passing in, or what types of values those functions will return.”

This was the last function I sent King:

const functionArray = [x=> x-1, x=> x*2, x=> x + ‘s’];

function comp(args) {
return function(x){
const result = args[2(args[1](args[0](x)));
Return result;
}
}

const printComp = comp(functionArray);
printComp(10);

Most of you readers will see the rudimentary lack of understanding on my part. For loops were really difficult for me to process when it came to looping through functions. At best, I could only conceive of a static means of passing the return value of a function to another function to process, and another, etc. At least I’d refactored all the bad poetry code out of my algorithm. And at least I grasped how to use a closure. But I was still so, so far, from the Kung Fu of HOF.

King, who’d been great about responding to my many failed attempts, didn’t get back to me on that last go. I’d spent hours and hours on trying to get the solution, and I tried to give up on it. Not to quit, but I knew the job had been filled and there was so much more I wanted to build and solve.

The problem didn’t leave my head, though. Weeks turned into months. I landed evening work as a teaching assistant for the boot camp I’d attended. I found a day time job, though not in web development. The bills were stacking up, my wife was transitioning out of grad school and into the big job search, and we needed steady income.

I found work doing nonprofit program development through some longtime connections. In that role, I was able to do some UI/UX and CMS-style web development and SEO optimization, but wasn’t able to dig in and do some real coding. Still, I got to learn all about Software as a Service (SaaS), Wix and Wordpress platform development, and dollar-store ways to use spreadsheets as databases without wanting to tear your hair out. They even let me rebuild and launch their entire website, which was a ton of fun. It took so much coding time away from my schedule, but it was paying the bills, and I had a lot of creative room to develop and learn about tech things.

Hours to code became scarce. I’d find them on the weekends and before and after my evening code camp work. I’d refactor here and there; solve algorithms; study the coding interview; read documentation… And that problem King set me to solve kept popping up in my head. I kept asking questions to the coding staff I worked with, kept reading and watching videos about HOF.

One day it clicked. I was out for a walk writing mind code. Young developers: this is a real pro tip: you don’t have to always be at your computer to write code. Some of the most elegant solutions I’ve ever found happened when I got away from my computer and went outside.

Listen to some instrumental music. Have some coffee or tea. A cocktail. Whatever floats your boat. But step away and write and debug in your head before you get to tossing and turning in bed. It’s fantastic, and it will make you a better coder.

I got back from my walk, pulled up VS Code, and slowly wrote these few lines of code:

const a = (x)=> x-1;
const b = (x)=> x*2;
const c = (x)=> x + ‘s’;

function comp(…args){
return function(x){
let result = x;
for (let arg of args){
result = arg(result);
}
return result;
}
}

comp(a,b,c)(10);

A for loop will reassign the result object with the return value from each argument as it runs each function it's been passed as an argument. Thus, for each iteration of the for loop, the argument functions will be passed the cumulative result, and each argument will put in it's assigned work ( subtract from x, multiply x, convert x to a string by adding a string to an integer, etc. ), where the function before it left off. In this way, we can pass a starting value through any number of functions that will process the data and make a return that can be picked up by the next function until whatever you want done, is done. This is a simple bit of code in many ways, but with this way of traveling through functions, there really isn't much of a limit on what you and the computer can accomplish.

Great developers, great poets, and great rivers all must know that which evades the rest of us: the small, simple thing like a worn stone, a strawberry blossom, or a higher order function truly tells the story of hard work, patience, and the long passage of time and experience.