Understand what arrow functions are and when it’s best to use them.
What is an arrow function?
Basic Syntax of an arrow function
- One parameter input, and one simple expression. No return statement is needed here.
- Multiple parameter inputs require parenthesis, still, with a simple expression no return statement is needed
- Multi-line statements require a code block body and a return statement
Traditional ES5 Function VS. ES6 Arrow Function
See the syntax below for the arrow function helloCat VS. the ES5 function heloOtherCat.
One of the major differences in the two functions type is of course syntax. From our above example see the ES6 arrow function helloCat() is cleaner and more concise, with less code.
Take a look at another example comparing the two functions type. See how concise and clean the numbersES6() arrow function is.
- ES6 Arrow functions take their values from their surroundings, their lexical scope
- ES5 functions take their scope from their context
Thank you for reading and I hope this gave you some clearer ideas of what arrow functions are and how they can be syntactically written.