Arrow functions in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of arrow function with implicit return

What is the output of this code?

Javascript

const multiply = (a, b) => a * b;
console.log(multiply(4, 5));

A undefined

B SyntaxError

C NaN

D 20

💡 Hint

Remember that arrow functions without braces return the expression automatically.

The arrow function multiplies a and b and returns the result implicitly. So multiply(4,5) returns 20.

❓ Predict Output

intermediate

Arrow function and this keyword

What will this code output?

Javascript

const obj = {
  value: 10,
  getValue: () => this.value
};
console.log(obj.getValue());

A undefined

B 10

C TypeError

D null

💡 Hint

Arrow functions do not have their own this; they use the this from the surrounding scope.

The arrow function uses the this from the global scope, where value is undefined, so it returns undefined.

❓ Predict Output

advanced

Arrow function returning object literal

What is the output of this code?

Javascript

const createUser = (name, age) => ({ name: name, age: age });
console.log(createUser('Alice', 30));

A undefined

B SyntaxError

C { name: 'Alice', age: 30 }

D [object Object]

💡 Hint

To return an object literal from an arrow function, wrap it in parentheses.

The arrow function returns an object with properties name and age. The parentheses ensure the object is returned, not treated as a block.

❓ Predict Output

advanced

Arrow function with default parameters and rest parameters

What does this code output?

Javascript

const sum = (a = 1, b = 2, ...rest) => a + b + rest.length;
console.log(sum(3, 4, 5, 6));

A 9

B TypeError

C 7

D 6

💡 Hint

Count how many extra arguments are in rest and add them to a + b.

a=3, b=4, rest=[5,6] so rest.length=2. Sum is 3+4+2=9.

❓ Predict Output

expert

Arrow function and lexical this in nested functions

What is the output of this code?

Javascript

function Counter() {
  this.count = 0;
  setInterval(() => {
    this.count++;
    if (this.count === 3) {
      console.log(this.count);
      clearInterval(this.intervalId);
    }
  }, 100);
  this.intervalId = setInterval(() => {}, 1000);
}
new Counter();

A undefined

B 3

C TypeError

D 0

💡 Hint

Arrow functions keep the this from the Counter function context.

The arrow function inside setInterval uses the this of Counter, so this.count increments correctly. When count reaches 3, it logs 3 and clears the interval.