JavaScript Functions (Function)

JavaScript functions are code blocks intended to perform actions or specific tasks.

Functions are reusable custom code defined by programmers that can make your program more modular and efficient.

When 'something' calls a JavaScript function, the function will be executed.

Define a function

Function definition(also known asFunction declaration) Using the function keyword, the order of functions is as follows:

• Function name

• The list of function parameters, enclosed in parentheses ( ) and separated by commas.

• The statement to define a function, enclosed in curly braces { }.
  

Here is the syntax for functions in JavaScript:

function nameOfFunction(parameter1, parameter2, ..., parameterN) {
　//　Code to be executed
　}

Function names can contain letters, numbers, underscores, and dollar signs ($) (following the same rules as variables).

In the first example, we will declare a function to print a greeting to the document.

function greet() {
　　　document.write("Hello, World!");
}

Function call

Defining a function does not execute. Defining a function is just naming the function and specifying the operation to be performed when the function is called.

You can call a function by adding parentheses () after the function name.

//Define the greet() function
function greet() {
　　　document.write("Hello, World!");
}
//Call the already defined greet() function
greet();

Now, we willgreet()The code is contained within a function and can be reused as needed.

//　Define the greet() function
function greet() {
　　　document.write("Hello, World!");
}
//　Multiple calls to the already defined greet() function
greet();
greet();
greet();

You can also use other methods to call a function:

• When an event occurs (when the user clicks a button)

• Call it from JavaScript code

• Automatic (self-executing)

In the later part of this tutorial, you will learn more about function calls.

Function parameters

When defining a function to accept input values at runtime, you can specify parameters.

Function parameters are listed in parentheses () in the function definition.

//Define a function
function greet(name) {
　　　document.write("Hello, ")}　+　name);
}
//Call the greet function with "Vishal" as a parameter
greet("Vishal");

You can define any number of parameters as needed.

//Define a function
function add(num1, num2, num3) {
　　　var total = num1　+　num2　+　num3;
　　　document.write(total);
}
　
//　Call a function
add(5,　20,　10);　//　Outputs:　35
add(-5,　8,　7);　　//　Outputs:　10

However, for each parameter you specify, you need to pass the corresponding parameter to the function when calling it, otherwise its value will become uncertain.

//Define a function
function showFullname(fName, lName) {
　　　document.write(fName　+　""　+　lName);
}
　
//　Call a function
showFullname("Kavy", "Mark");　//　Outputs: Kavy Mark
showFullname("John");　//　Outputs: John undefined

The way parameters work is similar to placeholder variables in functions; they are replaced with the values (called arguments) provided to the function when it is called at runtime.

Inside the function, parameters are represented as local variables.

You will learn more about function parameters in the later part of this tutorial.

Return value

JavaScript functions can use the return statement to return values to the script that calls the function.

The returned value can be any type, including arrays and objects.

When JavaScript reaches a return statement, the function will stop executing.

The following function takes a parameter called number and returns the parameter multiplied by itself (i.e., the number):

//Define a function
function square(number) {
　　　return number　*　number;
}
//When calling a function, the returned value will be stored in x
var　x　=　square(5);

A function cannot return multiple values. However, you can achieve a similar result by returning an array of values:

function makeArray() {
　　　var myArray = ["Apple", "Mango", "Banana", "Orange"];
　　　return myArray;
}

() operator calls a function

Using the above example, refer to the function object square and refer to the result of the function square().

If not using parentheses, it will return the function definition instead of the function result:

function square(number) {
　　　return number　*　number;
}
document.write(square(5));　　//　output　25
document.write(square);　//　Output the defined function

Function Expression

Although the function declaration above is grammatically a statement, it can also be used through a functionExpressionCreate a function.

Function expressions can be stored in variables and always called using the variable name.

Such functions can beAnonymous ; It does not need to have a name. For example, the function square() can be defined as:

var　square　=　function(number)　{　return　number　*　number;　};
var　x　=　square(5);　//　x　=　25

Another example:

var　sum　=　function(a,　b)　{
return　a　+　b;
});
var　x　=　sum(100,　8);　　//　x　=　108

The function above ends with a semicolon because it is part of an executable statement.

Function Scope

Variables defined within a function cannot be accessed from anywhere outside the function, and they will become local variables of the function.

//　The code here cannot use　city
function　myFunc()　{
　　　var　city　=　"New　Delhi";
　　//　The code here can use　city
}
//　The code here cannot use　city

Since local variables can only be used within their function, variables with the same name can be used within different functions.

Local variables are created when a function starts and are deleted when the function completes.