In this article, you will discover 4 ways that will allow you to create your own functions using JavaScript

The JavaScript language has functions that can come in handy to reuse in your codes, but not always a function will exist in the language and, usually, you will have to create your own custom functions.

Typically, in JavaScript and in any programming language, you can create a function to solve a small problem. Don’t create a function that does different tasks. It’s not convenient.

For example, if you are developing a shopping cart, don’t create one large function that does everything. Ideally, you should divide the process into parts so that, mainly, the code is easier to read and therefore easier to maintain.

In JavaScript, you can create and use functions in different ways. Next, you are going to see 4 different shapes.

Create functions in JavaScript with “Function declaration”
In this case, you first create or declare a function, and then you can call it in the sequence of your code.

For example:

// 
function statement add ( a , b )  { 
    return a + b ; 
}
 
// Call 
let sum = add ( 5 , 3 ) ;  // 8
 
console. log ( sum ) ;

In the above code, I have created a simple function that receives 2 numbers and returns their sum.

In the call, I save the result in a variable to use later in the program sequence.

Create functions in JavaScript with “Function expression”
These types of functions are defined as follows:

// Definition 
const add =  function ( a , b )  { 
    return a + b ; 
}
 
// Call 
let sum = add ( 5 , 3 ) ;  // 8
 
console. log ( sum ) ;

The result is the same. The only difference is that with Function expression we have a variable syntax since you create a variable in which you store a function.

Create functions in JavaScript with “IIFE”
Functions that are declared and invoked directly.

Following the example, I can do the add function with this methodology in the following way:

( function ( a , b )  { 
    console. log ( a + b ) ; 
} ) ( 5 , 3 ) ;

The previous code is defining and calling the function that returns printed in the console the sum of the 2 parameters sent.

Perhaps if you have seen jQuery code, this will be familiar to you since jQuery works exactly with this system.

Create functions in JavaScript with “Property methods”
When a function is put inside an object we will be seeing or using the property methods.

For example:

const calculator =  { 
    add :  function ( a , b )  { 
        console. log ( a + b ) ; 
    } , 
    subtract :  function ( a , b )  { 
        console. log ( a - b ) ; 
    } 
}
 
calculator. add ( 8 , 4 ) ;  // 12 
calculator. subtract ( 8 , 5 ) ;  //3

I can create a “calculator” object and define all the operators.

In the example, you can see the functions add and subtract.

As an exercise, I let you add the rest of the operators to your calculator: multiply, divide, etc.

conclusion
These are 4 methods you should know to work with functions in JavaScript.

They all give the same result but are created differently. Use the one that you like the most and suits your code.

Leave a Reply

Your email address will not be published. Required fields are marked *