This lesson teaches the concept of higher order functions (HOF) in JavaScript, a necessary building block of functional programming in any language.
A higher order function does at least one of the following things, often both:
To demonstrate this, we will build a higher order function, withCount()
, that modifies any function passed to it so that it logs out how many times it has been called.
console.log(countedAdd(1, 2));
// Call count : 1
console.log(countedAdd(2, 2));
// Call count : 2
console.log(countedAdd(3, 2));
// Call count : 3
it's can be interested to talk about clojure here
It would have been even greater if you had explained how to retrieve the count value within the higher order function. I was expected something like that: countedAdd.count
@hdorgeval this is a lesson on higher order functions, not on closures. A lesson on closures could show you how to expose the count value.
Also what you're asking is to add a property to the incoming function, which is possible, but could potentially be unsafe. Adding properties to functions and objects could overwrite functionality already stored at that property key. It is possible that the passed in function has a count
property already, and thus if we added it, we'd be breaking the API of the function.
@Kyle I'm confused by this lesson. To me intuitively functions are stateless: you put a value in, you get a value out. Using withCount you've hidden state inside of a function. So now calling that function multiple times (even with the same input) causes a side effect. I think I get it... it's just not intuitive at all. Any help appreciated.
Hi Karol,
Your intuition is only accurate if the function doesn't create a closure. Our higher order component, while a pure function (because it always returns the same function when given the same inputs), creates a closure that holds the count in state, Every time you use withCount
to modify a function, you create a new closure holding a new count
in that state. Then when you call the modified function, the side effect reads and updates that state held in closure.
This isn't a lesson on closures, but understanding them would help you understand how this higher order function works.
Hope that helps!
@Kyle thanks for the quick response! I understand closures, but what's throwing me off here is that a function is keeping a reference to a closure. Hmm, I think coming from an Objective-C and Swift background I'm still very affected by thinking in an OO-way.
At least in JavaScript, this is exactly the point of the closure, to hold some bit of state in memory that's still accessible by the exposed function or object. I have never written any Objective-C or Swift, so I can't really speak to the similarities or differences.
Thank you @Kyle. :)