ReactJs Map Page

Syntax

array.map(callback, thisArg)

The map() method creates a new array with the results of calling a provided function on every element in the calling array.

Example

const numbers = [1, 4, 9, 16];
const doubles = numbers.map((num) => num * 2);
console.log(doubles);
// Output: [2, 8, 18, 32]

Output

[2, 8, 18, 32]

Explanation

The map() method calls the provided function once for each element in an array, in order.

In the example above, the function num * 2 is called for each element in the numbers array, and the returned value is added to the new doubles array.

Use

The map() method is commonly used when you want to modify an existing array without changing the original array.

For example, you might use the map() method to create a new array of objects that contains only certain properties from an existing array of objects.

Important Points

• The map() method returns a new array, and does not modify the original array.
• The callback function that is provided to the map() method should return a value for each element in the array.
• The thisArg parameter is optional, and can be used to set the value of this inside the callback function.

Summary

The map() method in ReactJs allows you to create a new array with the results of calling a provided function on every element in the calling array. Use it to modify an existing array without changing the original array. Remember that the map() method returns a new array and does not modify the original array.