A function is a block of code that is designed to perform a specific task. They are a key feature of the language and are used to perform operations and calculations, manipulate data, and handle events.
For a procedure to qualify as a function, it should take some input and return an output where there is some obvious relationship between the input and the output.
Functions are defined using the “function” keyword, followed by the name of the function and a set of parentheses. The code to be executed by the function is contained within curly braces.
This example has no argument and runs every time when “greet();” is implemented into the code.
Functions can also accept input in the form of arguments, which are values that are passed to the function when it is called. These arguments are specified within the parentheses when the function is defined.
In this case string values are passed to the function, first Alice and then Bob.
Return statement
Functions can also return a value using the return keyword, which is used to specify the value that a function should return when it is called. The return keyword immediately ends the execution of the function and sends the specified value back to the calling code.
In this example, the add function accepts the argument x and returns the product (square). When the function is called with the argument 2 it returns 4, the argument 3 returns 9.
Note: Once the return keyword is executed, the function stops executing and control is returned to the calling code. This means that any code after the return statement will not be executed.
Local and global variables
Variables can be either global or local, depending on where they are declared and how they are used.
A global variable is a variable that is declared outside of any function and is available to all functions
Note: Avoid using global variables whenever possible, as they can make code more difficult to understand and make working on code harder than it could be. They also can lead to conflicts with other variables or functions in the script when not programmed optimally.
In this example the local variable can be used and changed everywhere in the program.
In this example, the local variable is only available within the local function. Attempting to access it outside of the function will result in an error.
Predefined functions
There are several functions inbetted in the JavaScript programming language available to use without declaring them. This means that you can call these functions at any time without having to define them yourself beforehand, as they are already integrated into JavaScript.
Usually, the object-independent functions mentioned here are linked to the Window object and therefore available in the global namespace.
Several of them you can find on SelfHTML, in this case with added explanations
decodeURI(): This function decodes a URI that has been encoded with encodeURI(). It converts reserved characters contained in the URI to their original form.
decodeURIComponent(): This function decodes a URI component encoded with encodeURIComponent(). It converts reserved characters contained in the URI component to their original form.
encodeURI(): This function encodes a URI by converting reserved characters to their percent-encoded forms. The reserved characters are certain characters that have special meaning in URIs, such as "/" or ":".
encodeURIComponent(): This function encodes a URI component by converting reserved characters to their percent-encoded forms. The reserved characters are certain characters that have special meaning in URI components, such as "&" or "=".
eval(): This function executes a string as JavaScript code. It is useful for executing dynamic code, but should be used with caution as it poses security risks.
isFinite(): This function checks whether a given value is a finite number. It returns true if the value is finite and false if the value is infinite or NaN (Not a Number).
isNaN(): This function checks whether a given value is NaN. It returns true if the value is NaN and false if the value is a number.
parseFloat(): This function tries to convert a string to a floating point number. It returns the floating point number or NaN (Not a Number) if the string is not a floating point number.
parseInt(): This function tries to convert a string to an integer. It returns the integer or NaN (Not a Number).
In general, you can classify the functions in the following categories:
Math object functions, String object functions, Array object functions, Date and time functions, Global object functions
Anonymous functions in JavaScript are functions that are defined without a name. They are often used to create short, simple functions that are only used once. They can also be used one time as they can not be called. The following example shows the easiest way to create such a function.
It’s clearly visible that the function has no name and therefore can’t be called again.
Recursive functions
recursive functions are function that calls themselves. They are useful for solving problems that can be divided into smaller subproblems which are solvable in a similar way.
In this example, the function calls itself with a modified input (n - 1) each time it runs. The function stops calling itself when the base case (n === 1) is reached, at which point it returns the result, in this case 120.
Arrow functions
An arrow function is a concise way to create a function expression. It has a shorter syntax compared to a regular function expression.
They are useful when you need to pass a function as an argument to another function, or when you want to define a function as a method in an object literal.
Call functions
Functions are called by using its name followed by a set of parentheses. It also takes arguments which are passable trough the parentheses.
String Objects
A string object provides methods for manipulating and working with strings.
You can create them in two different ways:
The second method uses a direct allocation and is therefore easier and more common.
Below are several methods listed to accomplish basic work on those strings:
charAt(): This method returns the character at the specified index in a string. The index of the first character is 0, and the index of the last character is the length minus one.
indexOf(): This method returns the index of the first occurrence of a specified value in a string. If the value is not found, it returns -1.
lastIndexOf(): This method is similar to indexOf(), but it returns the index of the last occurrence of a specified value in a string. If the value is not found, it returns -1.
substring(): This method returns a part of a string between two specified indices. The first index is inclusive, and the second index is exclusive.
split(): This method splits a string into an array of substrings based on a specified separator.
length(): This property returns the length of a string. It is not a function, so it does not need to be called with parentheses.
Input forms
An input form is a way to collect data from users through the use of HTML form elements. Form elements are special HTML tags that allow users to enter information, such as text, numbers, and files.
This illustration from our lecture describes the structure of how such a query is normally set up. The body contains a number of input fields that are filled in by the user.
Note: The code is written outside of “script”. Within “script” you can use and process the data.
This form includes three input fields: one for a name, one for an email address, and one for a password. The type attribute specifies the type of input field, and the name attribute specifies the name of the field.
With JavaScript you can use and process the gained data.
Here are listed some more Objects useful for creation forms.
