Have you asked yourself how reduce works in JavaScriptalso known as JS reduce method?
The method reduces in JavaScript it’s just one of many methods that allow us to manipulate the elements of an object array, also known as an arrangement in Spanish, that is, a list of elements. As an object, a array It has different functions at its disposal, which we know as methods. In this post, we will teach you how the method works reduces in JavaScript so you can use it in your future projects.
How does the reduce method work in JavaScript?
The method reduces in JavaScript it works in a similar way to the other methods of a array. Just like methods like map and filterin this method we have a array original that we pass through a function. In the end, we will get a result back, whether the elements are transformed or filtered. The difference between these methods and the method reduces of JavaScript is that in this method we get a single result. In this sense, it is more similar to the method find, which helps us find the first value that fulfills a function within the array.
So what exactly does the method do reduces in JavaScript? What we do with this method is insert a function that will be applied to the elements of the array and it will return a result. Up to that point it is very similar to other methods. The difference is that this function will be executed on each element of the array in progressive ordertaking the result of the previous element.
That is, the function will not only be executed for each element, but will also use the result of the function executed on the previous element as a reference to do so. Therefore, the method reduces In JavaScript it will return a single value as a result, since it is a single value that has been transformed throughout the elements.
This is much easier to explain with an example. Suppose we have a array with the following values:
const arraySum [17, 23, 18, 150]
So, if we wanted to add all these values, we could do it with the following function inserted in reduces:
arraySum.reduce ((previousValue, currentValue) => previousValue + currentValue)
This method defines the previous result as previousValue and the current element as currentValue. Like when we started array The first value does not have a previous result to take as a reference, this will be the result. That is, the function will start executing on the second element. So, let’s paint the result:
const resultArraySuma = arraySuma.reduce ((previousValue, currentValue) => previousValue + currentValue)
console.log (resultArraySum)
The result would be the value 208 painted by screen.
Now, you can also make the first value have a previous result as a reference using the parameter initialValue. This parameter is inserted just after the currentValue. In it, you can put the value directly or use a variable that references the value.
Do you want to learn more about the JavaScript reduce method?
Now that you have learned how the method works reduces in JavaScript, you are a little closer to mastering this programming language. Therefore, we invite you to continue learning with us in our intensive training on web development. In the Full Stack Web Development Bootcamp you will not only learn to master JavaScript, but also other aspects of web development. And in a few months you will be an expert! Don’t miss this opportunity and enroll now to succeed in the IT sector.