How to apply a function to each key of an accumulator and object in JavaScript?-JS Tutorial-php.cn

如何在 JavaScript 中对累加器和对象的每个键应用函数？

In JavaScript, we can use the reduce() method to apply a function to the accumulator and each key of the object (from left to right).

The reduce() method takes a given array and accepts a callback function as its first parameter. See array reduce() for more details. Let's take a look at the syntax of this method.

Syntax

array array.reduce(callback[, initialValue]);

Copy after login

Parameters

Callback- Function executed for each value in the array.

initialValue- The object used as the first argument for the first invocation of the callback.

Callback< /strong> The function passes four parameters

The first parameter is the accumulator, which is the previous callback function The result of the call, or the initial value if this is the first call.
The second parameter is the key currently being processed.
The third parameter is the key currently being processed. The value being processed.
The fourth parameter is the index currently being processed.

Then the reduce() method returns the accumulator.

Applying the reduce() method

Let’s look at a simple example to understand how the reduce() method works.

We have an array of objects, each object has a name and a value attribute. We use the reduce() method to sum the values.

We can achieve this by passing in a callback function that receives the accumulator (result of the previous callback function call) and the current value to handle. The callback function then returns the accumulator plus the current value.

Example

  Examples

Copy after login

In the above program, we have an array of objects, each object has a name and a value attribute. We use the reduce() method to sum the values.

We pass in a callback function((acc, cur) => acc cur.value), which accepts the accumulator acc being processed (the result of the previous callback function call) and Current value cur. The callback function then returns the accumulator plus the current value.

Then, thereduce()method returns the accumulator, which is the sum of all values.

< h2>Advantages of using reduce()
One advantage of using reduce() is that it can make your code more readable.
For example, if we want to sum the values in the above array, we can also use a for loop.
Example

Using for loop

Using for loop to sum the values of objects in an array

Copy after login

The abovereduce()method and for loop both achieve the same result. However, thereduce()method is more concise and easier to read.
Another advantage of using reduce() is that it can be used toprocess data in parallel.
For example, if we have an array of objects, each object has an name and a value attribute, and we want to process each object in parallel, we can use themap ()method.

let arr = [{ name: "John", value: 5 }, { name: "Jane", value: 7 }, { name: "Jim", value: 3 }]; let results = arr.map(obj => { // do something with obj });

Copy after login

However, if we want to process the data sequentially, we can use thereduce()method.

let arr = [{ name: "John", value: 5 }, { name: "Jane", value: 7 }, { name: "Jim", value: 3 }]; let result = arr.reduce((acc, obj) => { // do something with obj and return the result }, initialValue);

Copy after login

Conclusion
In this tutorial, we saw how to apply a function on an accumulator and each key of an object using the reduce() method. We also saw some advantages of using reduce() over other methods.
The above is the detailed content of How to apply a function to each key of an accumulator and object in JavaScript?. For more information, please follow other related articles on the PHP Chinese website!