4. Custom Functions
4.1. Function as a declaration
In JavaScript, the syntax for declaring a function is as follows:
The Syntax above starts with the keyword function then followed by the function name, followed by a parenthesis (no space), with optional argument-list, and the executable codes enclosed in curly braces/brackets. An optional return keyword statement could be used to indicate the end of a function and execution of a code/script and returns a value to the statement that called or invoked the function.
JavaScript Function names can contain letters, digits, underscores, and dollar signs which are the same rules for naming variables.
Argument-lists are additional information, referred to as parameters and separated by a comma. Which can influence how a function behaves.
The codes below show how a function addTwoNumbers through version 1 and 2 could be declared with or without an argument-list. As you can see in the sample code how an argument-list could influence the output of a function.
Sample code without an argument-list:
Sample code with an argument-list:
Importance of a function returning a value
We often create functions to calculate something and provide a value that can be used somewhere in our scripts. Thus, the return keyword inside a function is very useful to turn a function into a variable with a dynamic value as illustrated also in the sample codes/scripts above addTwoNumbers.
However, there wouldn’t be much use if the result will just be within the function, unless we use it somewhere in our script. The return keyword is used to pass the result of the function. Then, we can just reference or call out the function to give the result, similar to a variable. Thus the line in the previous code, calls the function with two arguments and then receives a result from the function and prints it on the browser.
document.write(addTwoNumbersv2(3, 6)) ;
Take note that once a function has already returned a value, the function ends. A more detailed discussion on processing function output will be discussed in the learning guide 9.3.
Argument-list
Is a value or a list of values that a function uses when it runs. Oftentimes, we “recycle” or “reuse” native and custom functions as needed depending on certain circumstances. We can manipulate the arguments by providing necessary data to the functions in order to apply the function’s logic to different sets of data at different times. The argument-list in the functions are considered “local variables” inside the function and are not accessible outside of the function.
To place arguments, add one or more variables, separated by comma/s, in the parenthesis upon defining the function as shown below. Then, when the function is called, anything included within the parentheses will be passed into that variable as the function executes.
function addTwoNumbersv2(num1, num2)
If a function declared with argument-list receives no values from a calling statement, then all arguments will have a data and data type of undefined.