JavaScript Arrow Functions

Make this exercise in Visual Studio Code and node.js.

• Documentation on MDN Web Docs

It’s time to get familiar with arrow functions in JavaScript. Arrow functions are a concise way to write functions in JavaScript. They are especially useful when working with array methods like map, filter, and reduce. So it’s similar to lambda functions in Java.

Exercise:

Rewrite the following function as an arrow function:

const greet = (): string => {
  // Write your code here
  return '';
};

Store the result in a variable called greet and call the function to see the output.

Expected Output:

Hello, World!

Exercise:

Convert this function into an arrow function:

const add = (a: number, b: number): number => {
  // Write your code here
  return 0;
};

Store the arrow function in a variable called add and call it with add(5, 3).

Expected Output:

8

Exercise:

Rewrite the following function using an arrow function with an implicit return:

const multiply = (a: number, b: number): number => {
  // Write your code here
  return 0;
};

Test it by calling multiply(4, 2).

Expected Output:

8

Exercise:

Write an arrow function called getRandomNumber that returns a random number between 0 and 1 (using Math.random). Test by calling getRandomNumber().

const getRandomNumber = (): number => {
  // Write your code here
  return 0;
};

Expected Output:

A random number between 0 and 1 (e.g., 0.456).

Exercise:

Rewrite the following function as an arrow function with a single parameter and implicit return:

const square = (x: number): number => {
  // Write your code here
  return 0;
};

Test by calling square(5).

Expected Output:

25

Exercise:

Use an arrow function to double each number in the array:

const numbers: number[] = [1, 2, 3, 4];
const doubledNumbers = numbers.map((value: number): number => {
  // Write your code here
  return 0;
});
console.log(doubledNumbers);

Expected Output:

[2, 4, 6, 8]

Exercise:

Given an array of numbers:

const numbers: number[] = [5, 12, 18, 7, 24];

Use an arrow function with the filter method to create a new array containing only the numbers greater than 10. Print the result.

Expected Output:

[12, 18, 24]

Exercise:

Use an arrow function as a callback in the setTimeout function to print "Hello after 1 second" after a 1-second delay.

setTimeout(() => {
  console.log('Hello after 1 second');
}, 1000);

Expected Output (after 1 second):

Hello after 1 second

Exercise:
Write an object person with properties name and sayHello. The sayHello property should be an arrow function that logs "Hello, my name is <name>" where <name> is the value of the name property.

const person = {
  name: 'Alice',
  sayHello: (): void => {
    // Write your code here
    console.log('');
  }
};
person.sayHello();

Expected Output:

Hello, my name is Alice

(Note: This exercise demonstrates that arrow functions do not have their own this context.)

Exercise:

Create an arrow function greet with two parameters: name and greeting, where greeting has a default value of "Hello". The function should return a message like "Hello, Alice!" if no greeting is provided.

Test with:

const greet = (name: string, greeting: string = 'Hello'): string => {
  // Write your code here
  return '';
};

console.log(greet('Alice')); // Uses default greeting
console.log(greet('Bob', 'Hi')); // Uses custom greeting

Expected Output:

Hello, Alice!
Hi, Bob!