What is reduced in JavaScript

Array.prototype.reduce ()

The method reduces an array to a single value by reducing two elements at a time (from left to right) by a given function.

syntax

.reduce ()

parameter

Function that is applied to each value in the array and has four arguments:
The cumulative value is the return value of; the previously returned value of the last call to or are used.
The element of the array currently to be processed.
Optional
The index of the current element of the array. Starts with index 0, if specified, otherwise with index 1.
Optional
The array to be fetched on.
Optional
The value of the first argument to be used the first time in to. If no initial value is given, the first element of the array is used. Calling on an empty array without an initial value results in an error.

Return value

The result value of the reduction.

description

executes the function for every existing element in the array, except for unset values. has four parameters:

    When you call up for the first time, the values ​​of and depending on the parameter are as follows:

    • If specified when calling, is equal to and is equal to the first value in the array.
    • If not specified, is equal to the first value in the array and will be equal to the second value in the array.

    Note: If not specified, the function is called starting at index 1, the first index is skipped. If is specified, it starts at index 0.

    If the array is empty and none is specified, a will be created. If the array has only one element (the position does not matter) and none is specified, or if is specified and the array is empty, the individual value is returned immediately without calling.

    It is always safer to state because there are three possible outcomes without, as shown in the following example.

    How reduce () works

    Assume the following function is used:

    The function is called four times, the parameters and return value for each call are described below:

    Return value
    1st call
    2nd call
    3rd call
    4th call

    The returned value of is the return value of the last function ().

    It is also possible to use an arrow function instead of a whole function. The following source code produces the same output as the previous one:

    If the second parameter is from, the result will look like this:

    Return value
    1st call
    2nd call
    3rd call
    4th call
    5th call

    The value returned by in this case is.

    Examples

    Sum all elements of an array

    Alternatively written as an arrow function:

    Sum of values ​​in an object array

    To sum up values ​​in an array of objects, got to an initial value can be specified so that each element in the function is iterated through.

    Alternatively written as an arrow function:

    Make nested arrays a flat array

    Alternatively written as an arrow function:

    Counting instances of a value in an object

    Group objects by a property

    Connect arrays in an array of objects using the spread operator and by

    Remove duplicates in an array

    Sequential processing of promises

    Function composition enables pipelining

    Map function with reduce

    Polyfill

    If it is really necessary to use outdated JavaScript environments that do not support it, it is better not to replace it completely because it cannot be made non-enumerable.

    Specifications

    Browser compatibility

    BCD tables only load in the browser

    See also