Scopes, Higher Order Functions and Callbacks
Yesterday, I went to another event. This time, run by Codesmith, another bootcamp for software engineering. They teach only Javascript, but they teach the NERD stack, AKA Node.js, Express.js, React and Databases.
I had been asked in interviews before what higher order functions were but I don’t think I’ve ever properly answered the question. So let’s pop into it!
The biggest takeaway for me was learning about execution context and thread of execution. I had been following this thought process whenever I write Javascript, but I never put a phrase to it.
As seen above, the execution context stack is also known as the call stack. The Global Execution context exists throughout the entirety of the program. The call stack follows LIFO, last in first out. This means that the last item in has to be the first item executed, and it has to be cleared before you get to the item below. You’d have to “pop” it out first and run through the function before returning back into the outer function.
The computer creates some space in memory for the global execution context that sort of protects your code. The memory space is allocated specifically for the program. This is also known as scope.
When you invoke function B, the rest of the program sort of pauses until functionB()’s execution context is run. In this case, until you log “In function B” to the console, the rest of the program is paused until you complete that first. This is because Javascript is synchronous, so it only does one thing at a time.
First, the computer logs “Start function A” to the console. After that, functionB is defined but not invoked. It is invoked, however, on line 11. It is here where functionB is hit and we log “In function B” to the console. After you log “In function B” to the console, you exit the function and you finally log “In function A” to the console.
Now asynchronous, as you may have guessed, means that you can do multiple things at a time. However, even asynchronous nature in code is still synchronous.
When you make a fetch request to a server asking it for information, it takes time for that server to reply and send back the aforementioned information. However, instead of waiting for the server to reply and then do something, we can run other code while we wait for the server to reply.
One way I like to imagine this is an analogy to cooking. If you’re boiling water, you’d have to wait about 5 minutes or so until it finishes boiling. You can choose to either stand there doing nothing and just stare at the pot of water until it boils, or you can do something while you wait for your water to be ready. Meditate, make a sandwich, send some emails, do some pushups. By the time you’re done, the water will be ready. This, my friend, is asynchronicity. And yes, that word is as hard to type and spell as it is to say.
But Lawson, you might ask, you still haven’t told us what Higher Order Functions and callbacks are.
Ah, but I have. Higher order functions are functions that take in another function as a parameter, or where a function is defined within another function like above. Callbacks are functions that are defined, but not yet used, like functionB.
Javascript is the only language that allows you to pass in other functions as a parameter. In absolutely no other language can you do this. This is immensely powerful.
That’s all for now, folks! Thanks for reading and have a great new year!
