Anonymous functions

- [Instructor] Over the previous couple of movies, we created a named function, findBiggestFraction. The purpose of a named function is, we can define it in the code and then call it when we need it, by referencing its name and passing some arguments to it. Named functions are useful if we need to call a function many times to pass different values to it or just need to run it several times and it's also useful when functions just get really big and just clutter up the overall flow of the script. In that case, we create functions and put them above the main script to be called when needed.

It just makes for better-structured code. In other cases, we often use anonymous functions. And if you've read any JavaScript tutorials, I'm sure you've seen far more anonymous functions than named ones. In this movie, we'll focus specifically on how to do something very similar to what we've done so far using anonymous functions. Anonymous functions don't have names, so they need to be tied to something, a variable, or an event, or something similar to run. Right now, I want to rewrite our example, using an anonymous function and I'll start by deleting everything we have and making sure my console is clear.

Now, I'll set up a very similar example to what we had previously. I'll start by defining my two variables, a, I'll set it to 5/7 and b, set to 18/25, for instance. Then, I create a new variable, theBiggest and this variable will contain our anonymous function. I start our anonymous function the same way we started a regular function, by typing in function, but since this one is anonymous, it doesn't have a name and we'll just follow function directly by two parentheses.

Then, we set up our code block and inside the code block, we'll set up var result then, if a is bigger than b, then result. And you've seen all this before. Here, we have a and a, else result = b and b. And then we console.log(result}.

Here, my anonymous function is placed inside a variable as a function expression, meaning it is stored as if it were a normal value and only executes if we call the variable as if it were a function. So, to get this function to run, I have to call the variable, theBiggest and add a parentheses at the end of it. This tells JavaScript, hey, inside theBiggest variable, there's an anonymous function. Can you please run that anonymous function and then we should get the console log result out in the console.

Save and here we have it. b 0.72 This is the array we have created in the previous movies and we can see the code works properly. We can test it to make sure it actually works by passing in our old values, 3/4 and 5/7. You'll remember here, the answer is a. And we get the answer a. We can also return the result of an anonymous function using the return keyword, just like we did before. So in place of saying console.log(result), I'll say return result, save.

Now I get a returned result inside theBiggest and that means I need to console out theBiggest so that we can see it on the console. So I'll wrap console.log around theBiggest. Maybe spell it correctly, too. console.log and here we get the same result. Your next question will probably be, "But since we don't have a name for the function, how can I still use arguments?" Well, you still can. You just have to use them slightly differently.

So, we start by setting our arguments, just like we did before. I'll create two arguments here, a and b for the anonymous function. Then, I need to pass the arguments into my function and because I'm using the variable name as the function name, I just add my arguments here. So a and b can be, let's say 7/9 and 13/25. Save and run it. And now you see, even though we defined var a and b up here, I'm actually now using these arguments down here and they just map to a and b inside my anonymous function, meaning I can just take my variables out, save, and it still works properly.

So, as you can see, anonymous functions work pretty much the same way as named functions, especially if you place them inside a variable. Now, there are some weird things that happen once you start doing this, but this is a fairly good example of how we use anonymous functions. Later on in the course, we'll also hook anonymous functions directly to events to do far more interesting things. Cause right now, we're still stuck with basic math, but don't worry, we'll get to something really cool with anonymous functions later.