All right, next up, let's talk about Arab functions, and these are functions that are often used
in callbacks and you'll see what I mean a minute.
So this is a function is passed in as a parameter to another function in that function calls the first
function.
So here's an example over function that's called Run It and it takes a primer f and inside that function,
it just says run that F as another function.
And then when we actually call run it, we pass in a function to it and we're going to show some examples
that are going to make this a little more clear.
But the Arrow function says you have a list of parameters.
In this case, we have none.
So there's left parenthesis, right parentheses and then the arrow.
And then after that is the definition of the function.
So curly brace and curly brace.
So when F is called above all that does is run the function that says council log.
Hello, world.
Now, here's a little bit more of a. a real example, so array's have a filter function and what you
do is you pass in the arrow function into it.
And this is a really short version because all we're doing is saying X Arrow X, less than five.
And so what this does is it takes every a every value of a and evaluate it, passes it into this function
and checks to see if it's less than five.
So at the beginning, this is completely confusing, so we need to run some examples.
OK, before we get completely into the area of functions or functions are a shortcut for just a regular
function, so let's do it that way.
So what we do is I'm going to create a anonymous function.
I'm going to say let my function equals function.
I'm going to take a string and I'm going to log out that string.
OK, so I have a function I can I can call it
so I can call it my function.
Hello.
So let's just run that.
So we've got our second helo down here and what it is called this function and Ranit.
So let's say we had another function that wanted to take this function and do something with it, so
let's make another function down here and we'll call it function string at her story or one last year
or two.
And what this is going to do is to take two strings, concatenate them together and put them to the
log.
So our final string is going to look like there's a concern
now.
So just consider what we want a function to do this.
So we're going to take a function as a parameter.
And this function is going to take this string.
So when we call this.
Going to say string atter
Hello, World, and a third premier has to be the function so opposite to my function.
And that is all we're going to do, so let's run this, but we'll run it with a debugger so we see what's
happening.
So sources and we're just going to get a break here and run it, so it takes the break, I'm going to
hit if loving to step in and steps into the string at her function and it puts those two strands together.
And so we have a whole world string now.
We got our function.
And you can see here when I hover over it, it's my function.
So we're just going to step into it.
And now it's back here inside this function and it took our string.
Hello, world is called Log it up.
So there's our result, instead of defining a function here, we can define the function right here.
So we'll just say, function astar, in this case, I want to keep it the same thing, I leave it on
the same line
and there we go to get rid of my function.
Let's go back and run this.
So we stopped here.
We have a function there, so let's step in and remove the string adder and we got to string one string
to our function.
You can see it says it's anonymous that there is no name for this function, but is this function is
defined up here.
So if we step in, it's going to step back to here and you can kind of see a console's kind of highlighted
there.
And she's going to run that and it's going to be done.
As a little girl.
All right, so the earth function takes the place of this, so like I said, it's just a shortcut.
So get rid of the word function and we got to put instead of the curly braces when we need to curly
braces, we'll say equal sign greater, then that's the arrow.
So that defines our function.
We have our parameter coming in.
It says here, our arrows says, here's the function and then we have our function body.
And you can do the exact same thing, so it's safe to bring this up.
Ron.
Stepan.
Steps back there in the exact same result.
Now, there's an even shorter version where all you need to do is return a value as opposed to that
next.
So instead of our function doing logging, all we want to do is concatenate the values together that
says send in the strings in general and return them concatenated together.
So since all we're doing is the return statement, we don't need the curly braces or the return statement
and we're going to get two parameters.
So all this and we'll say return astar one plus last year to enthralls is going to do is concatenated
to values together and return them.
So in our function we no longer want to do this or we want to do is say
cancel that log.
Yes.
One come Aschiana to.
So this is an even shorter version of the Arrow function.
So let's run that and before we do that, let's correct spelling of console.
So let's run this.
And let's step in, step in, it's going to execute the year one plus first year to go back to council
that log and we're going to get the same result overall.
So often with the arrow functions, it's a built in function that you want to call in.
The example that I showed in the slides was the array filter.
So let's do that next.
So let's get rid of some of this stuff.
Let's get rid of this and we'll define an array.
I said, what are you.
Equals one coming to a three, four, five, six, seven, eight, nine, comma ten.
We'll get ten things into it.
And then I want to get an array out of the values between three and seven.
So we'll say let be array equals array, dot filter.
And then here we're going to specify our filter.
And because it's only one parameter, you don't have to use the parentheses.
So you just say the parameter X and you can use it if you like, equals greater.
And then the return statement and what the array is going to do is, as I said at one and then set it
to, as I said, at three and check this return statement for each one.
So I must say it's true when X is greater than or equal to three three and X is less than or equal to
seven.
So it's true in those cases
semicolon.
So it's a really short version of the of the array, but it's very commonly seen in some of these built
in functions.
And then let's load this up
and let's go back to here and let's get rid of our break because we don't really want it anymore.
And I'm going to run Hello, World, and you can see the just output, an array of Southbury three,
four, five, six, seven.
Then when you're looking at documentation and let's bring up documentation on the Mozilla site for the
array filter.
So here it is.
And you see here the syntax says array, dot, filter, callback.
And that's your clue that you're going to be passing in a function.
And the callback has current value and that's what it's going to get, an index, an array, you know,
show some some examples.
Filter equals that that Folker.
And then in visual studio code, well, you often see when you're doing this
is the word predicate, and that's also your clue that it's going to take a callback like this.
So it there's a function except for three arguments.
OK, so that's our introduction to the Arrow function, and you'll use it most often as callbacks to
DILTON functions.