JavaScript Arrow Functions

Functions are the main “building blocks” of the program. They allow the code to be called many times without repetition.

In this blog, we will learn about JavaScript Arrow Function

What is Arrow Function in JavaScript

Arrow functions are introduced in ES6, which provides you a more accurate way to write the functions in JavaScript. They allow us to write smaller function syntax. Arrow functions make your code more readable and structured.

• Arrow functions are also known as anonymous functions (the functions without a name and not bound with an identifier).
• They don’t return any value and can declare without the function keyword. Arrow functions cannot be used as the constructors.

Advantages of Arrow Functions

1. It reduces the code size: When we use the syntax of arrow function, the size of the code gets reduced. We can write less amount of code by using the arrow function.

2. Return statement is optional for single line functions: In ES5, we need to define the return statement in the functions, but in ES6, we do not require to define the return statement for single-line functions.

Javascript Arrow Functions Syntax

First of all, let us see the simple ES5 function syntax.

Now, let us see the ES6 version syntax.

ES6 Arrow functions provide you with an alternative way to write a shorter syntax compared to the function expression. See the following example:

In the above example, the sum() function expression returns the sum of two numbers.

The following example uses an arrow function which is equivalent to the above sum() function expression:

If the function body contains just a single statement, you can omit the brackets and write all on the single line like the following code.

Multiline Arrow Functions

Sometimes we need something a little bit more complex, like multiple expressions or statements. It is also possible, but we should enclose them in curly braces. Then use a normal return within them.

Like this:

Thanks