Javascript part 4

6 min readDec 28, 2020

Today we talk about “functions” in javascript.

(This is an important topic because we use functions quite a bit in Javascript.)

functions:

functions are fundamental building blocks for javascript. A function is a javascript procedure to set statements that perform a task or calculate a value. In English, we build a machine to do tasks for us instead of outputting “hello world” ten times like this.

etc..., etc…

Instead of that, you would build a function or “a machine” to perform this task for you.

In the first step, We must define the function inside the scope of where you want to call it. A function statement most of the time will have a “function” keyword(look at the example below).

The second word after the function is usually the name of the function, which you use to call the function. So this one would be “square”, so to to RUN this function all you would have to do it call “square()”. ( it is usually a good idea to call it something you relate to the task it is doing. In this case, I'm just squaring any number you would pass in.).

This machine above or function takes in an argument which we name “number”, the user will pass in any number they want( remember number is just a placeholder, you can call it anything you want)

Above we run the whole process of the “square” function. We call “square()” and pass in 10 into the function. I want to explain this because it took me a while to figure this out. We built a “machine,” which takes in an argument(a random object) which in this case we call “number ”. So when you call the function it can take values or “numbers” of your liking. “number” is just a placeholder, so the machine doesn't break(and if you don't pass in the argument at all, it will break.) We also put the “return” keyword, so the function knows what to output when calling that function or “machine.”

Here is another example, we first set the variable to “someVar” and the value to “hat.”

Then we tell “myFunction()” to return the value of “someVar.” we call “myFunction()” on the next line, and it returns “hat.” (its a good habit to always set the variable before the function or it will not read it.)

Also important to mention is SCOPE;

in the example above, I set “someVar” outside of “myFunction” this is ok because the keyword “var” gives us global scope (or access to that variable anywhere). If we put the “someVar” inside the function, it would have “local scope.” We will talk more about scope in a later section.

Now, stay with me!

If for some reason you have two of the same variable names…the local scope takes priority over the global scope (check the example below.)

You see we set two of the same variables that use the same name, called “someVar”. then we have two different values, in two different locations. The function first reads the variable inside the function and says, “Okay, great; we have a match ” outputs “shoes.” Then doesn't even look any further.

If you look at the example below, you will notice that I call “someVar” by itself, and NOW it returns just “hat” because we are outside of that function. So we get back “someVar” with the value of “hat.” (that's the best I can explain scope at this time.)

ADVANCED function fun:

We will talk about nested functions now. (Also took me for a loop when first learning it.)

We can take functions and put them inside of functions like so.

A lot going on here; I will try my best to make sense of it.

So I like to look at it from the inside out. I start with function “square” it's taking in an argument of “x” then returns “ x * x”(multiply). that was one whole function, then we have “addSquares,” which has “square” function inside of it. It takes two arguments, “a” and “b.”

its returns “square(a)” + “square(b).” we can only call “square” within the “addSquares” method. If we had it outside of it, it would be out of scope, and it would run an error saying “square not defined” or something like that.

With that being said, “square()” can use the outer information or functions, variables, and arguments.

The “addSquares()” can not use the variables and arguments of the inner function inside “square.” These are called closures ( google for more information).

to finish up here, here we pass in two arguments “2, 3”. function “addSquares()” sees that then goes to the return, sees “square(a)” , looks inward to “square()” function then passes in the number “2”. Runs that inside multiples “2” squared. then repeats that same process for “3”. so now we have “4” and “9”, back into “addSquare()” and we add them all up and return the answer of “13”. (that was more or less true lookup scoping from functions here for more details.)

Okay, I think that was enough for today; let your brain take all that in, and ill see you on the next one.