Welcome back to learn to code in JavaScript in this lecture, we're going to be talking about functions
so as a function of function allows you to break down complex systems and decompose them into smaller
parts.
So functions are defined and they receive parameters.
So you can send information to a function and functions can return a single value.
So folks are called in order to invoke their functionality and then the parameters are sent into the
function.
So think of a function to calculate your salary.
You send in how many hours you work and what your hourly wages, and then the function itself returns
the actual result.
Functions can call other functions, so if your function had to find out whether you were working overtime
or not, maybe it calls another function to find that out.
In a function itself can be stored in a variable.
We'll find out more about that later.
So here are some examples of defining a function and calling it.
So here's a function.
We use the word key word function to define it and give it a name.
My function open parentheses and close parentheses in another.
We're just saying consider log.
Here I am.
And then to invoke it, we just say the word my function with parentheses and a semicolon.
Now this one has parameters and B coming into it and the function itself returns the addition of A and
B and so you could say let total equals Adir 10 to 20 and then total can have the value of 30.
You can have default values for parameters, so if something is not provided, you get the default.
So in this case, we're going to have the ability to add three numbers together, A, B and C, but
if she's not provided, we're just going to use her.
So the total equals that are 10 come 20 is kind of like the same here is going to be 30.
Another way you can define a function is using what's called an anonymous function.
And in this case, the function itself gets assigned to a variable.
So we say let F, which is a variable, equals the function A come a, B, return eight times B, and
then you invoke the function using the variable F 10, comma five.
All right.
Let's use this arithmetic idea that we used in the the slides.
So let's say we had this function atter and it takes parameters.
A comma, B, not only give parameters along the name like a variable, but adding two things together.
It makes sense to call them A and B, return A plus B, and then I'm going to prompt for the the values
to add.
And what I'm going to do is put them into a string and then split the string into numbers.
So I can say
of what I want to call these
abs equals prompt
enter numbers separated by commas.
And then I'm going to say let
AAPS equals,
let's say array it out that split.
On the comma, and then because these come in strings, we're going to want to change them in the numbers,
but centering it right here will create another function and we'll call it function array, string to
number.
And we'll say it's called array.
They are.
And all we're going to do is look through this array and create another array that has numbers instead
of strings.
So we'll say we'll just do this.
New array say no array equals an empty array and then we'll do the four of we'll say, that's OK.
I said, what else of array?
And then we'll say, no array.
That push will say no, that percent.
Yes.
So take each one, pass it into an integer and put it into this number array and then we'll just return
it.
So that will convert our array into an array of numbers.
So.
We can combine this if we wanted to, we could say we're getting an array, so just call a raised string
to number.
So we're calling a function in that we're calling another function, but let's make it a little simpler
just to make it more understandable.
So that's just one way we can do it.
Let's do what we're doing before we got our observer one call, ESOPs Ray Star.
And then we will say, but aaps array equals array, string to number
after a star search can do that conversion for us and then we will logout or atter to that log atter
of array Sub-Zero Array, someone
is going to log that result up.
So let's see what happens.
When are 10, comma, 20 and 30?
Now we're going to debug and see how this works on the inside, so go to our sources.
Let's maximize this and give us a little bit more room so we can see here we have our function.
Hello.
And I didn't mention this, but we've been using functions all along.
We had this function called Hello.
So at the break there, right at the beginning.
So let's run it.
We do the Castlebar clear, we get our ops and we'll say 12 at 13 this time.
And if we examine this or if we look over here, we can see we have our ops and there are a string of
12 of 13.
So this is one string.
And then when we do the split, we have our observer Greystar.
And you can see it's an array of two strings, 12 and 13, but there's strings separated or they're
surrounded by quotes.
And then to step into this function, that was one of these things here.
Step into next function, call this F 11 or control, plus some F 11, and those could jump down inside
that function.
So we declare a new array and.
So the number we have, our HRR that got passed in this is the the I got passed in, which is this array
of strings.
So we do it at 10:00.
So our S is 12, string 12, and we're going to push it into that number.
So now No.
Three has a string of 12.
So then we'll get the next value.
So now, as is the string of 13 and we push it into the number right now, the number has 12 and 13
and we return the number and that once we get out of this function, our local takes on what it had
originally.
So now we have our observer that has 12 and 13, so then I'll step in again with that 11 and we'll go
into our outer function and see A is 12, B is 13.
And so then we just return that summation and that's what we get, our twenty five.
OK, let's add some more functionality so we can add another method called subtract the
Pavilion B.
So let's see the result.
Somewhere in that.
And we'll say four or five.
And we've got nine and negative one four months, five plus negative one.
OK, let's take a look at what's called the rest Syntex.
So with the rest, Syntex does is allows functions to accept an unlimited number of parameters, and
you can think of this as the best parameter because it accepts the rest of what is offered.
And I'll show you what I mean.
So in this example, we have the the what looks like the spread operator, dot, dot, dot, args as
the input to our function.
But this is actually the rest operator.
What it says is take all the arguments coming in and put them into an array called ARGs and then we'll
use that as an array.
So for let a of args console Loga is going to output everything in the array.
So let's take a look at an example.
So we'll start we'll change our outer function to use this rest operator, so we'll say that I thought
it doesn't have to be called hard to be called anything ad operators, and then we don't have to be
here anymore.
We have this array called ad operator.
So we're just going to go through the array and add everything up.
So we'll say let turtle equals zero and then we'll use the four of them.
We'll say for a group of ad operators,
Total Plus equals up and now we'll return the total.
All right, let's let this run.
I need to go back and say, let up.
Four of five.
And we got our first result is nine, like we expect.
Now, let's see what's going on on the inside of this, so we will go into the debug mode.
One of our sources and we are going to be starting right here where we call at source, set a break
on line eight or run or type in six to seven.
So we have our values and the observations of six and seven.
So I'll use that for someone to step in.
And then once for him, we had this array called ad operators, and it has zero index six and there's
one.
Index seven.
So I'm just going to go through this loop twice total becomes.
You see down here, six.
And then it becomes 13 and then we return the total to exactly what we would probably expect.
Click continue on back to console and we see the 13 what's.
Take out a full screen now, let's do something a little bit more with this, we want to be able to
accept many operators so far.
Right now, let's ignore the prompt and just type in some operators.
So say four comma, six come eight, comma, ten, comma 12.
So it has been five operators instead of just two.
So say
back this.
And we lost a friend.
Yeah.
OK, back to Crome.
Messed up.
And it doesn't matter where we are now, because we're not using that, so we're going to go into outer
with these five numbers.
Yeah, maximizers.
So for him to step in, we've got an array of the five numbers right here, you can see it.
And then we're just going to go and watch the total off to the right.
Right here, so I'm just going to step one line at a time.
Ten.
Eighteen, twenty, eight, forty, and we return 40, and that's what gets printed up.
Console, and it is 40.
All right, let's do a little bit more.
What we'll do is we'll go back to using the the prompt in any more numbers, so let's take our Opsware
and put it in here.
But here's the problem is our ops rate is an array and we don't want an array.
We want numbers.
If we want an array, we would just accept an array here instead.
And we would just say, all right, so in that case, we say, hey, we're accepting an array, but
we don't want that.
We want to accept an unlimited number of numbers.
So to break this in two numbers, we will use the spread operator.
And so we want to do is take this array and break it apart.
Now, previously, when we're doing this, we put brackets around it again and make it back into an
array to clone the array.
But we don't want to clone the array.
We just want the parts of the array.
So that's what we're going to do.
So let's save this
and let's expand this, I've got a brake set right there, so let's go run our world and we'll type
in 11, 13, 15, 17, 19, five odd numbers.
So there we have our Ray Sangma step down with up 11.
And here we see that our ad operators gets those array values 11, 13, 15, 17 and 19.
And so then we're just going to step through this again, scroll it up so you can see the total.
So then Toga's the value of 11, 24, 39 and so on, until we get all the bodies in the file total is
75.
So I'm going to continue and finish this.
And we see the result is 75.
Now, one more thing to point out is just because I said I want the rest operator here doesn't mean
I can accept some other operators, some other arguments.
That is.
So I could still say a comma and then the rest operator saying, give me one in a and everything else
put in the the rest operator put in the add operators.
So in that case, we want to start total out to be a.
So you do this when you know you need, at least in this case, one argument, one parameter.
And then you can have more than that, and it might make more sense than the case where we had a come
up kind of see where we said C equals zero before, where you want to say, I know I need A and B to
add two things together, but what else do I need?
So let's let's do that.
Let's say a B comma, the rest operator so we know we're going to need A and B, so we start out by
adding A and B together and this requires us to have A and B. So if we had or less than two things,
we're going to not have value for B, which is going to be a problem.
So let's give this a try.
So it's once.
And I'm going to just put in two values for Karma five and let's go into debug that way we can get a
clear idea of what's happening.
That our outer has the account of the first time to step in and we set a has for Bihar's five and eight
operators is an empty array.
So add total is A plus B and C every year it's nine.
And then we're not going to do anything in the loop because there is nothing and we're just going to
turn the nine.
So no problem.
So we get our nine in the result, let's try it again and let's only enter one thing and see what happens,
I'll say for.
To step in, we could see the AIA's form B is undefined.
Now, Ed. doesn't mean undefined, so we just end up with not a number, so that is not going to be
the result we want, obviously.
So when we get out of this and we still don't have an array, so we're just gonna to the total.
Going to blog it out.
And we see that our result is in a not a no.
And then we'll do it one more time with several operators.
One, two, three, four, five will step in and see that he got one.
We got two.
And the ad operators got three values.
Three, four or five.
And so it's just going to go ahead and add those three numbers to one plus two.
And so our total resolve is 15.
All right, so that's an introduction to functions where we included creating a function and then calling
functions, passing them parameters and getting return values back.