JavaScript Basics-Functions: Part 4

JavaScript functions are blocks of code that either perform a task or return a value. These blocks of code are executed when they are called upon. There are 2 steps to making a function:

1.      Creating or Declaring the function

This is referred to as a function declaration. The function keyword is declared followed by a name of your choosing, a set of parenthesis, and a set of curly brackets. JavaScript statements end with semi colons, but in the case of a function declaration there is no need. Just make sure not to use any of the reserved JavaScript keywords, this can cause unintended outcomes.

The part of the declaration we want to focus on for the moment are the set of curly brackets. The area within theses two curly brackets is referred to as the body of the function. This will contain all the code to either perform a task or return a value. Above is an example of a task that will set the value of the demo element to "Hello World!".

Returning values from a function requires the use of the return keyword. Using this before the variable or value you want to return will instruct the function to calculate a value and exit the function.

2.      Call Function

This is the syntax for calling a function. This is done by typing the functions name followed by a set of parenthesis and a semi colon. When a function is called the code stated inside the body of the function declaration is ran by the computer. Earlier at the time of declaration the program is just saving the function into the program memory, but not actually executing the code.Typing the function name without the parenthesis will produce a reference to the function. This is for execution functions at later times than when they are encountered by the interpreter. However that's material for a later date.

3. Function Parameters & Arguments

A function can also take parameters when being declared, which are variables that can be used within the body of the function. This is useful for providing the function reference to values that are outside it’s local scope. Parameters are placed within the set of curly brackets separated by commas. These parameters can then be used within the function body using their names. These will act as containers that will take on whatever value that is passed to it's corresponding parameter.

When you call a function the values that go inside the parenthesis are called arguments. The parameters from the declaration will consume the value of the corresponding arguments for that specific call of the function.

You can have as many parameters as you want, but as a rule of thumb a function should do one thing very well. Complex tasks can be achieved by breaking them down in to steps all handled by a different functions and then establishing relationships between those functions to produce a desired result.

Additional Resources