map function in JavaScript: how to create a new array?

map function in JavaScript: how to create a new array?

Introduction: In JavaScript, array is a very commonly used data structure. It provides many built-in methods for operating and processing arrays. Among them, the map function is a very useful method. It can process each element in the array according to specified rules and create a new array. This article will introduce the map function in JavaScript, how to use it, and some practical code examples.

1. What is map function?

In JavaScript, the map function is a built-in method of an array. It is used to process each element of the array and return the processed result as a new array. In layman's terms, the map function loops over an array, applies a processing function to each element, and forms a new array with the function's return value.

2. How to use the map function to create a new array?

Creating a new array using the map function is very simple, just follow the following steps:

Step 1: Prepare an array
First, we need to prepare an array as the map function target array. This array can contain elements of any type, such as numbers, strings, objects, etc.

const numbers = [1, 2, 3, 4, 5];

Step 2: Define a processing function
Next, we need to define a processing function to process each element in the array. This function can be a predefined function or an anonymous function.

function double(number) {
  return number * 2;
}

或

const double = function(number) {
  return number * 2;
};

Step 3: Use the map function to process the array
Finally, we use the map function to process the array and save the processed results in a new array.

const doubledNumbers = numbers.map(double);

In this way, we have successfully created a new array doubledNumbers, in which each element is the result of multiplying the elements in the original array by 2.

3. Actual code examples

Below, we will demonstrate the use of the map function through some actual code examples.

1. Convert the strings in the array to uppercase letters:

const strings = ['apple', 'banana', 'orange'];
const uppercaseStrings = strings.map(function(string) {
  return string.toUpperCase();
});

console.log(uppercaseStrings);
// 输出：['APPLE', 'BANANA', 'ORANGE']

2. Square the numbers in the array:

const numbers = [1, 2, 3, 4, 5];
const squaredNumbers = numbers.map(function(number) {
  return number ** 2;
});

console.log(squaredNumbers);
// 输出：[1, 4, 9, 16, 25]

3. Extract object properties from the array:

const books = [
  { title: 'JavaScript高级程序设计', author: 'Nicholas C. Zakas' },
  { title: 'JavaScript权威指南', author: 'David Flanagan' },
  { title: 'JavaScript设计模式', author: 'Addy Osmani' }
];
const titles = books.map(function(book) {
  return book.title;
});

console.log(titles);
// 输出：['JavaScript高级程序设计', 'JavaScript权威指南', 'JavaScript设计模式']

Summary: In JavaScript, the map function is a very useful method that can perform operations on each element in the array according to specified rules. Process and create a new array. Using the map function to create a new array is very simple. You only need to prepare a target array, define a processing function, and use the map function to process it. In practical applications, the map function can greatly simplify code writing and improve development efficiency. To sum up, mastering the use of map function is a very important skill for JavaScript development.

The above is the detailed content of map function in JavaScript: how to create a new array?. For more information, please follow other related articles on the PHP Chinese website!