JavaScript Arrow Functions

This YouTube video was created by Steve Griffith.

The arrow functionopen in new window is a compact version of the standard function expression, which make them desirable when passing anonymous functions to methods.

Syntax

The arrow function does not require the function keyword and, in most cases, can also forgo the curly braces and the return statement.

// standard function expression
const greeting = function (name) {
  return `Hello, ${name}`
}

// arrow function expression
const greet = name => `Hello, ${name}`

console.log(greeting('Joe')) // "Hello, Joe"
console.log(greet('Jack'))   // "Hello, Jack"

Because of the shorter syntax, arrow functions are preferred when working with passing functions to arrays methods.

function add (...numbers) {
  return numbers.reduce((total, number) => total += number)
}

console.log(add(4, 8, 3, 5, 2)) // 22