Arrow vs function

Learn when arrows cannot be used (constructor, arguments).

Arrows cannot be constructors

Arrow functions cannot be used as constructors; calling them with new throws an error. They also have no prototype property.

const Dog = (name) => { this.name = name; };
new Dog("Rex"); // TypeError

To create objects, use a classic function or a class. An arrow does not work here, so you must pick another approach.

No arguments object

Arrow functions have no own arguments object. Unlike classic functions, you cannot reach all passed parameters through arguments; it refers to the outer scope's arguments.

const f = () => {
  console.log(arguments); // outer arguments
};

Instead, use a rest parameter ...args:

const f = (...args) => args;

A rest parameter returns a real array; arguments is array-like but not an array.

Exercise Convert the arguments function to an arrow

The sumAll classic function uses arguments. Convert it to an arrow function, use a rest parameter ...numbers, and return the total with reduce.

Show example solution

const sumAll = (...numbers) => numbers.reduce((acc, n) => acc + n, 0);

Test yourself

Which throws an error?
- const f = (a, b) => a + b;
- const f = n => n * 2;
- const f = () => 0;
- const f = (n) => { this.n = n; }; new f(5);
Show answer

const f = (n) => { this.n = n; }; new f(5); — Correct. An arrow cannot be called with <code>new</code>; it throws TypeError.

Rest instead of arguments

const sum = (____) => args.reduce((a, b) => a + b, 0);

Show answer

const sum = (...args) => args.reduce((a, b) => a + b, 0);

Match the features

new arrow

throws TypeError
arguments in arrow

outer scope's
rest parameter

returns a real array
A case where you should NOT use an arrow?
- As a constructor that produces objects
- As an array callback inside map
- As a short single-line helper
- As a setTimeout callback to keep this
Show answer

As a constructor that produces objects — Correct. An arrow cannot be a constructor; <code>new</code> throws.

Next lesson: Summary - Arrow functions

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies