Check out a free preview of the full Hard Parts: Functional JS Foundations course:
The "Function Decoration Introduction" Lesson is part of the full, Hard Parts: Functional JS Foundations course featured in this preview video. Here's what you'd learn in this lesson:

Will demonstrates that although a function cannot be edited without it compromising its purity, function decoration as the appearance of a function being edited in its scope, but is instead creating a new function, and inserting in it the function that needs to be edited. - https://static.frontendmasters.com/resources/2019-07-31-hard-parts-functional-js/functional-programming.pdf

Get Unlimited Access Now

Transcript from the "Function Decoration Introduction" Lesson

[00:00:00]
>> Will Sentance: Function Decoration. Now we convert our functions more easily to make them suit our task. If we're saving little blocks of code, little functions to be used again and again, little single, tiny functions to be used again and again. Ideally, I don't wanna have to rewrite that code if they're slightly different.

[00:00:20] Now, there's one thing I can do, write higher order functions, I can have my function. Don't need to rewrite it, I just edited when I run it, I insert some specifics. The problem is, I've had to have left a placeholder in about higher order functions like copywriter, manipulate or map, I'd leave a placeholder.

[00:00:35] When I run map, I specify exactly how I want to hit each element of the array. But sometimes I wanna edit functions where I haven't left placeholders. I wanna retro actively give them new functionality Without people is, can I edit a functions body after I've saved it? Everyone, together.

[00:00:57] No, I can't exactly. Once the functions been saved, I can't go in erase individual elements in a rack, and add or remove stuff. Functional code, once it's saved, I can't go back in there and interact with it, it's set.
>> Will Sentance: So we wanna be able to edit functions but not rewrite them from scratch.

[00:01:18] So instead, we're gonna use a technique known as function decoration. It's going to appear, to edit functionality that's been saved, is gonna appear to do so. It's actually not going through though. Instead, it's going to create new functions, we're a new function inside, which the function we wanna edit is gonna be inserted in somehow, some way.

[00:01:49] So when we run the new function, it's gonna appear to be running our function. And with a slightly different behavior, it's gonna appear to have edited our function. But actually, we created a new function, where we're running a function inside of it that we want to edit. And so that new function will look like, it's the original function but edited.

[00:02:06] Here it is. So particularly if you wanna add a permanent memory, for example, to an existing function we've saved. Am I able to add the feature of a permanent memory, a backpack, to an existing function I've saved? If I've saved a function, am I able to give it a backpack after I've saved it?

[00:02:23]
>> Will Sentance: Absolutely not. The only way is, for me to get it is if I save the inside the running another function and return it out. So if I didn't do that, how can I give it a permanent memory? Well there is a way. It's cool, because want to use it.

[00:02:39] So for example, if I want to edit my function, here's a classic one.
>> Will Sentance: Suppose I wanna edit my function, say multiple by 2, to limit it to run only once. So I can only run it once, and from now on, it's fixed only run once. Run it one time, runs their problem multiple by to say we limit of ten, running again, it says, sorry, you've already run me you can't run me again.

[00:03:05] This is a technique we wanna use all the time in programming. Often we wanna limit a function of being called even in a game. For example, tic tac toe, you want to limit a function to be called only one time on a given cell. You want to go to turn it from being zero to an x, and then back to enact, you want to limit it to run one time.

[00:03:21] While I can't edit my multiply by 2 function and give it a backpack to say you can only run it once, once it's saved. So instead I'm going to do a technique called function declaration. I'm going to use Wantify, a function that's going to appear to convert my multiply by 2 functions, save their, into a version of multiply by 2.

[00:03:50] That is limited to run any once. But it's gonna be a big fraud. In reality, inside of Wantify, I'm gonna create a brand new function, set for my brand new function inside of Wantify if I have a backpack? Yes, it will. I'm gonna return that out, it's gonna be called in there and stored in once by multiple by 2.

[00:04:14] And To buy multiple by two is gonna behave just like multiple by 2, and it's the first time. But in reality, it ain't behaving like multiply by 2. In reality, inside of it, it's going to run from its backpack, the multiply by 2 function. Under the condition that upon checking back pack, a counter is still zero.

[00:04:39] And then its commitment That say now is one, and if we run more to find [INAUDIBLE] 2 [INAUDIBLE] Again, is gonna say sorry, Is now one in the back pack, you can't run me again. But it's gonna be really interesting interweaving here. So I said we're looking for another way.

[00:04:56] We're gonna map this out in full, but let's look at another way. Our wants to find multiply by 2, is going to be the inner function that comes out of one and five.
>> Will Sentance: It's gonna appear to edit multiply by 2, it ain't. You can't edit a function.

[00:05:12] It's gonna appear to give multiply by 2. You know we could even actually have one to five multiplied by 2 be given the name, I don't know, multiply by 2 once, or whatever. It's gonna appear to edit multiply by 2, it's not. In reality, what is it doing?

[00:05:29] It's creating a new function that does have access to a backpack. We need a backpack with a limit of function to run only once. I should stress that. A function to run once and limited to only run once, needs to remember, it's previously been run. Otherwise, how can it be limited run Once?

[00:05:47] And he wants a normal function is, remember his previous running, so he doesn't know it's been run before. So we need our function to have a backpack, and that's exactly what's gonna happen here. But we can't give most over to a backpack later. So we're instead going to decorate it.

[00:06:02] Which in the land of functional programming, means, creating a brand new function, called inner, inside of once Inside of which we're going to check a counter, which is going to have access to a persistent counter in the backpack of the first running of in a, notice once by by multiple by 2.

[00:06:23] We're going to not be able to run convert me, which is gonna be multiplied by two again. These people is using closure, the principle of giving functions permanent memories, to super charge our functions, to add new functionality with our function multiplied two, once it's being initially saved.
>> Will Sentance: And it turns out to be a core principle of functional programming.

[00:06:52] Beyond this folk, once you realize that you can have your function, the pseudo edited, by building a brand new function inside, of which it's going to run the function that's passed to the function once a [INAUDIBLE] Produces a brand new function. Once you realized that, you may not just wanna store in the backpack, a counter, for example, you may actually want to store an input for a function that requires two inputs.

[00:07:26] Not that one out, and now the functionary requires one input. Which might start finally, to solve Seth's worry. And when I list all functions with my dream and functional programming, is listing of my functions, do this one, then this one, then this one, automatically. With put three style, no reference to the running of them.

[00:07:44] No putting the brands on and saying what to take as the input. So if my function that I'm taking into my list of functions, around one after another of another, requires two inputs, it's gonna break my whole setup, we'll see all that in the moment. For now, here we go people, we are going to build a new, apparent Multiply by 2 function that works.

[00:08:06] As I'm gonna multiply by 2, but actually, is a totally different function that happens to run multiply by 2 inside of itself. And we're gonna keep that multiply by 2 function inside of it. Once if I multiply by 2 inside of its backpack.