Function In Javascript: Types Of JavaScript Functions, Function Definition, Calling Function

(Last Updated On: April 2, 2021)

Description:

Function in JavaScript –In programming, functions are very important structures. In structured programming, the complicated and large program is broken down into smaller units by assigning unique names to them. These units are called the subprograms. In JavaScript, subprograms are referred to as functions. Function in JavaScript makes your scripts more concise and readable. Therefore, a function is defined as:

A set of statements written to perform a specific task and having a unique name is called function. Function in JavaScript is invoked (or called) for executing with the reference of its name. the control transfers to the body of JavaScript function. After executing the statements of the function, the control returns back to the point where the Function in JavaScript was called along with possible returned value.


Amazon Purchase Links:

Top Gaming Computers

Best Laptops

Best Graphic Cards

Portable Hard Drives

Best Keyboards

Best High Quality PC Mic

Computer Accessories

*Please Note: These are affiliate links. I may make a commission if you buy the components through these links. I would appreciate your support in this way!

Importance of Function in JavaScript:

Function in JavaScript is complete and independent program. A single function can be called again and again from multiple places in a program to perform a particular task. The JavaScript function code is stored In only one place in memory, even though the function is called many times for executing in the program. If a program is written without using Function in JavaScript then there may be repetition of the same piece of code at various places in the program.

Advantages of Function in JavaScript:

  • Easy to write a program:

We know that solving a problem becomes easier if we break it into a set of smaller tasks. Similarly, writing a large program becomes easier if we divide it into smaller parts each of which takes the form of a JavaScript functions.

  • Easy to understand and modify the program:

The complexity of the program is reduced. It makes easier to understand the logic of the program. It is also easy to make changes and detect errors when large program is divided into subprograms.

  • Eliminate duplicate code:

If a same task has to be performed at more than one place in a program, then common code can be written as function. The Function in JavaScript is called for executing with the reference of its name only. Thus same set of instructions does not have to be written again and again to perform the same task. This reduces the total lines of code of the program.

  • Facilitate re-usability:

Function in JavaScript is written for one program can be re-used into another new program. Thus, the programmer can develop a program quickly in a very short time.

Types of Function in JavaScript:

In JavaScript, functions are divided into two types. These are:

  • Built-in functions
  • User-defined functions



Built-in Function in JavaScript:

The predefined functions that are part of the programming language and can be used for different purposes are called built-in functions or library functions. These are ready-made subprograms. The built-in Function in JavaScript make the programmer’s job easier to design the program and reduce the program development time. JavaScript provides several built-in Function in JavaScript that can be used to solve different kinds of problems.

User-Defined Function in JavaScript:

In JavaScript, a programmer can write his own functions to perform specific tasks. These functions are referred to as programmer-defined Function in JavaScript or user-defined Function in JavaScript. A Script may contain many user-defined functions.

Function in JavaScript Definition:

The JavaScript function definition is actual code (set of statements) that is written for function to perform a specific task. a function must be defined before it can be used (called for execution). In JavaScript function can be defined:

  • In the <head> section of html document.
  • In the <body> section of html document.
  • You can also place code of several JavaScript functions into a separate text file. The extension of the file must be js ( js stands for JavaScript). The JavaScript functions definitions stored in external file cannot contain the script tag.

Usually, the definitions of JavaScript functions are placed in the <head> section of Html document.

The JavaScript function definition consists of two parts. These are:

  1. Header of JavaScript function definition
  2. Body of JavaScript function definition

 

Header of JavaScript function definition:

The first line of function definition is called function header. It is also referred to as function declarator. It indicates the start of function definition.

Body of JavaScript function definition:

The set of statements that are written between the curly braces just after the header of JavaScript function definition is called body of function. The curly brackets ( { and }) define the start and end of the Function in JavaScript. The set of statements are written for the function inside the curly brackets. The body of function performs a specific task when Function in JavaScript is called for executing from any place of the program.


Defining a Function in JavaScript:

The general syntax to define the function is as follows:

function fname(parameter list)

{

Body of the function;

}

Where

Function:

In JavaScript, the keyword ‘function’ is used to define the function. It must be written in lowercase letters, otherwise an error occurs.

fname:

specifies the name of function. The rules for naming a function are similar to the rules for naming a variable. Each Function in JavaScript must have a unique name.

parameter list:

represents the list of parameters or arguments separated by comma (,). They may be in the form of variables or constant values. They are passed to the JavaScript function when the function is called for execution. The variables used in the header of function definition are treated as local variables. They cannot be declared in the body of the Function in JavaScript.

Note that a Function in JavaScript with no parameter must included the parentheses () after the function name.

For example, to display a message, the Function in JavaScript is definition as:

function test()

{

document.write(“First Function”+ “<br>”);

document.write(“ok”);

}

In the above JavaScript Function definition “function test()” specifies the header of the function definition while two statements enclosed in braces are the body of function definition.

Calling a Function in JavaScript:

Execution the statements of the function to perform a specific task is known as calling of the function. A Function in JavaScript is called for executing with the reference of its name. if a function has parameters then actual values in the form of variables or constants are also given in parentheses after name function. If a Function in JavaScript has no parameter, then the parentheses are left blank.

Similarly if a function returns a value then it can be called in an arithmetic expression, or can directly be called in an output statement.

When the Function in JavaScript is called for executing, control transfers to the function definition and its statements are executed. After executing the function statements, the control transfers back to the calling function/script.

You can call a function from anywhere within the page or even from other pages if you include the external file that contains the JavaScript function definition.


JavaScript code is given below to print a message by using a function.

Function in JavaScript

In the above script, the function message() is defined in the <head> section. This JavaScript function is called for executing using statement “message();” in the <body> section. When this function call statement is executed, the control will be transferred to the function definition. The Function in JavaScript message() has only two statements to print a message. After execution of these statements, the control returns back to the <body> section and transfers to next statement that comes after function call.



Example Write JavaScript code using function that print pattern of asterisks (*) :

Function in JavaScript

Recommended For You

About the Author: Engr Fahad

My name is Shahzada Fahad and I am an Electrical Engineer. I have been doing Job in UAE as a site engineer in an Electrical Construction Company. Currently, I am running my own YouTube channel "Electronic Clinic", and managing this Website. My Hobbies are * Watching Movies * Music * Martial Arts * Photography * Travelling * Make Sketches and so on...

Leave a Reply