Conversation

Your input fuels progress! Share your tips or experiences on prioritizing mental wellness at work. Let's inspire change together!

Join the discussion and share your insights now!

Comments 0

Sharpen your coding skills—try JavaScript challenges on TOOLX now!

advertisement

Explain Functions in JavaScript - Types and Usage

javascript functions

Introduction

Consider a scenario where a Web page has been designed to greet the user with his/her name at the click of a button. A code can be used here to accomplish this task but may result in the same output on repetitive execution. However, writing these statements each time for the same action is tedious, time-consuming, and error-prone.

To make the code more task-oriented and manageable, JavaScript allows group statements to be made before they are invoked. This can be achieved by using the concept of functions. A function is a reusable block of code executed on an event's occurrence. The event can be a user action on the page or a call within the script.


Functions

A function is an independent and reusable block of code that performs certain operations on variables and expressions to fulfill a task. A function might take parameters, which are variables or values on which it performs operations. After performing operations, a function might return the resultant value to display it in the browser. For example, a function named Add () might take two numbers on which the addition operation will be performed and will return the result of addition.

A JavaScript function is always created under the script element. JavaScript supports both user-defined and built-in functions.


1. Declaring and Defining Functions

JavaScript allows declaring a function using the function keyword. The keyword is followed by the name of the function and parameters enclosed within parenthesis. If the function does not take any parameters, then it must be specified with empty parenthesis.

Once the function is declared, you need to define the function by specifying the operations or instructions within the curly braces ( and ). These curly braces indicate the start and end of the function block, which is collectively referred to as the body of the function.

Certain conventions must be followed for naming functions. They are as follows:

  • Can consist of letters, digits, and underscore
  • Can begin only with a letter or an underscore
  • Cannot be a JavaScript keyword
  • Cannot begin with a digit
  • Cannot contain spaces

The syntax to create a function in JavaScript is as follows:

Syntax:

function function_name (list of parameters)
{
// Body of the function
}

Where,

  • Function: This is a keyword used to declare a function.
  • Function_name: Indicates the name of the function.
  • List of parameters: This is optional and specifies the parameters to be passed to the function separated by commas.

A function must be defined before it can be invoked in the script. Also, there can be multiple functions defined within the script element.


2. Invoking Functions

A function requires to be invoked or called to execute it in the browser. To invoke a function, specify the function name followed by parenthesis outside the function block.

A function can be defined and invoked even in an external JavaScript file. Also, a function can be called from another function in JavaScript. The function that invokes another function is called the calling function; whereas the function that is called is referred to as the called function.

Functions provide the benefit of code reusability by allowing the user to call a function multiple times.


3. Parameterized Functions


Parameterized functions refer to JavaScript functions that take parameters. These parameters hold values on which the function requires to perform operations. Parameterized functions can be created to accept values for performing operations.




4. Ways of Passing Arguments


There are two ways of passing arguments to a function namely, pass by value and pass by reference. The description of these is as follows:

  1. Passing by value - Refers to passing variables as arguments to a function. In the pass-by-value method, the called function does not change the values of the parameters passed to it from the calling function.
    This is because each parameter occupies different memory locations.

  2. Passing by reference - Refers to passing objects as arguments to a function. In the reference method, the called function modifies the values of parameters passed to it from the calling function. This change is reflected when the control is passed back to the calling function.


JavaScript functions javaScript Functions functions in javaScript types of functions types of functions in javaScript built in functions

advertisement