Search⌘ K

Arrow Functions

Explore arrow functions and their advantages over traditional functions, including concise syntax, implicit returns, and lexical this binding. Understand how they improve code readability and scope handling, especially useful in React event handling.

What are arrow functions?

Arrow functions are another great addition to our ES tool kit since its introduction in ES2015. Previously, function declarations were written in the following manner: the keyword function, followed by an optional function name, parentheses in which the function arguments were given, and the function body. The function body is the actual content of the function:

function(arg1, arg2) {}

Arrow functions greatly simplify by making the function keyword redundant.

function(arg) {}

For example, the function above would be transformed into this arrow function:

arg => {}

This is a valid function in ES2015!

Implicit return

Arrow functions are ...