Arrow functions

Arrow functions are modern JS syntax to declare a function, which is introduced in ES6. Besides a shortes syntax, below are the properties:

  • Arrow functions don’t have their own bindings to this, arguments, or super, and should not be used as methods.
  • Arrow functions cannot be used as constructors. Calling them with new throws a TypeError. They also don’t have access to the keyword.
  • Arrow functions cannot use yield within their body and cannot be created as generator functions.

A good suggestion from developer Lars Schöning:

  1. Use function in the global scope and for Object.prototype properties.
  2. Use class for object constructors.
  3. Use => everywhere else.


(param1, paramN) => expression

(param1, paramN) => {

let/const variableName = (argument) => {function body}

Example for function with no arguments

When having no arguments, you have to use empty parentheses in the function decalaration. When returning a single value, no need of curly brackets and return keyword.

// Traditional function
function randomNumber() {
    return Math.random();


// Arrow function syntax
let randomNumber2 = () =>  Math.random();

// Traditional function with parameter as fn
document.addEventListener('click', function() {

// Arrow function with parameter as fn
document.addEventListener('click', () => console.log('click'))

Example for function with only one argument

When having exactly one argument, you may omit the parentheses.

function isPositive(number){
    return number >= 0

let isPositive2 = number => number >= 0;

const multiply = number => number * 2;

Example for Function with more than one arguments

function sum(a, b){
    return a+ b;

const sum2 = (a,b) => { 
  return a+b;

MDN Docs

Read More