Course Banner


Arrow Functions

Arrow functions or its also called short-hand functions are used to write the code in the
same line. It s called short-hadn function because it takes less space and can be written in less time.

  1. Function keyword is not used in this

  2. Return keyword is not used in this

  3. Curly braces are not used in this

Below is the example of Arrow functions


<!DOCTYPE html>

<html>

<body>

 

<h2>JavaScript Arrow Functions</h2>

 

<div>Arrow functions are used with function expression Arrow functions are not used  with function declaration.</div>

 

<p>Arrow functions are not supported in IE11 or earlier.</p>

 

<div id="result"></div>

 

<script>

const vals = (a, b) => a * b;

document.getElementById("result").innerHTML = vals(5, 5);

</script>

 

</body>

</html>


 

Output : 

 

Generally const keyword is used  with function declaration because its considered  good to use const keyword rather than var keyword
If your function  has a single statement there are no curly braces required. Also there is no requirement of return statement.

If your function has more than one line then curly braces are required and also return keyword can be used.

 

<!DOCTYPE html>

<html>

<body>

 

<h2>JavaScript Arrow Functions</h2>

 

<div>Arrow functions are used with function expression Arrow functions are not used  with function declaration.</div>

 

<p>Arrow functions are not supported in IE11 or earlier.</p>

 

<div id="result"></div>

 

<script>

 

const vals = (a, b) => { return a * b };

 

document.getElementById("result").innerHTML = vals(5, 5);

 

</script>

 

</body>

</html>