An Arrow Function in JavaScript also called a “Fat arrow” function is a syntactically compact alternative to a regular function expression. It allows us to write shorter function syntax. Arrow functions are anonymous and change the way this
binds in functions.
Arrow functions doesn’t support its own bindings to the this
, arguments
, super
, or new.target
keywords.
#1 Basic Example
var materials = [
'JavaScript',
'HTML',
'CSS',
'Buginit.com'
];
// before
console.log(materials.map(function (material) { return material.length}));
// with arrow function
console.log(materials.map(material => material.length));
// expected output: Array [10, 4, 3, 11]
#2 Basic syntax
(param1, param2, …, paramN) => { statements }
(param1, param2, …, paramN) => expression
// equivalent to: => { return expression; }
#2.1 Optional Parentheses
Parentheses are optional when there’s only one parameter present:
(singleParam) => { statements }
singleParam => { statements }
#2.2 Without Parameters
If you do not have any parameters then it should be written with a pair of parentheses like the example below:
() => { statements }
Top comments (0)