Arrow Functions in Javascript

Introduction

Arrow function is the function in javascript which has syntax with arrow like this "=>". It is generally used by the developers when they have to write concise method or callback. It was introduced in ECMASCRIPT 2015 (ES6).

Basic Syntax

The basic syntax of the arrow function is mentioned below.

const output = (parameters) => { function body}

In output variable, the output will be stored, parameter will be passed in parentheses (shown in above code block) and function body will contain the instruction of performing any specific task.

Arrow function with no parameter

The arrow function which has no parameter will be termed as 'Arrow function with no parameter'. In this case, parentheses will be empty.

Arrow function with one parameter

The arrow function which has one parameter will be termed as 'Arrow function with one parameter'. In this case, parentheses can be removed.

Example :-

Arrow function with multiple parameter

The arrow function which has many parameter will be termed as 'Arrow function with multiple parameter'. In this case, parentheses are required.

Example :-

Implicit return vs explicit return

In arrow function, if you remove return keyword and curly braces {} then it will be called as implicit return. It is generally used when you have concise and only one regular expression. The output result will be returned automatically.

Example :-

In arrow function, if you add return keyword and curly braces {} then it will be called as explicit return. It is generally used when you have multiple regular expression. It is block body of function body.

Example :-

Difference between arrow function and normal function

1. Arrow function was introduced in modern javascript (ECMASCRIPT ES6 2015) where as normal function was always there.

2. We use => symbol in arrow function where as we use "function" keyword in normal function.

3. Arrow function are not hoisted as it is stored in variable where as normal function are hoisted.

4. Arrow function do not have this keyword, they inherit it from surrounding area or scope where as normal function have their own this keyword.

5. Arrow function is used for concise and clean code where as normal function are used for writing big and multiple lines of code.

Conclusion

Arrow function is one of the crucial part of the modern javascript. It has many pros and cons while writing code. It make your code neat and clean which is maintainable fo a longer period of time.