- [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.
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}.
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.
- Working with data
- Using functions and objects
- Changing DOM elements
- Handling events
- Working with loops
- Making images responsive using markup
- Troubleshooting code
- Validating functionality