TypeScript Array reduce()
Syntax & Examples

Array.reduce() method

The reduce() method applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single value.

Syntax of Array.reduce()

There are 3 variations for the syntax of Array.reduce() method. They are:

1.
reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T): T

Parameters

ParameterOptional/RequiredDescription
callbackfnrequiredA function that is called for each element in the array, taking four arguments: previousValue, currentValue, currentIndex, and array.

This method executes the callback function for each element in the array, resulting in a single accumulated value. The first time the callback is called, previousValue is the first value in the array, and currentValue is the second value.

Returns value of type T.

2.
reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T

Parameters

ParameterOptional/RequiredDescription
callbackfnrequiredA function that is called for each element in the array, taking four arguments: previousValue, currentValue, currentIndex, and array.
initialValueoptionalA value to use as the first argument to the first call of the callback.

This method executes the callback function for each element in the array, starting with the provided initialValue. The first time the callback is called, previousValue is initialValue, and currentValue is the first value in the array.

Returns value of type T.

3.
reduce<U>(callbackfn: (previousValue: U, currentValue: T, currentIndex: number, array: T[]) => U, initialValue: U): U

Parameters

ParameterOptional/RequiredDescription
callbackfnrequiredA function that is called for each element in the array, taking four arguments: previousValue, currentValue, currentIndex, and array.
initialValueoptionalA value to use as the first argument to the first call of the callback.

This method executes the callback function for each element in the array, starting with the provided initialValue of type U. The first time the callback is called, previousValue is initialValue, and currentValue is the first value in the array.

Returns value of type U.


✐ Examples

1 Using reduce() to sum an array of numbers

In TypeScript, you can use the reduce() method to sum all the numbers in an array.

For example,

  1. Define an array numbers with some initial values.
  2. Use the reduce() method with a callback function that adds the previous and current values.
  3. Store the result in the variable sum.
  4. Log sum to the console using the console.log() method.

TypeScript Program

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((previousValue, currentValue) => previousValue + currentValue);
console.log(sum);

Output

15

2 Using reduce() with an initial value to calculate the product

In TypeScript, you can use the reduce() method with an initial value to calculate the product of all numbers in an array.

For example,

  1. Define an array numbers with some initial values.
  2. Use the reduce() method with a callback function that multiplies the previous and current values, and an initial value of 1.
  3. Store the result in the variable product.
  4. Log product to the console using the console.log() method.

TypeScript Program

const numbers = [1, 2, 3, 4, 5];
const product = numbers.reduce((previousValue, currentValue) => previousValue * currentValue, 1);
console.log(product);

Output

120

3 Using reduce() to flatten a nested array

In TypeScript, you can use the reduce() method to flatten a nested array into a single array.

For example,

  1. Define a nested array nestedArray with some initial values.
  2. Use the reduce() method with a callback function that concatenates the previous and current values.
  3. Store the result in the variable flattenedArray.
  4. Log flattenedArray to the console using the console.log() method.

TypeScript Program

const nestedArray = [[1, 2], [3, 4], [5, 6]];
const flattenedArray = nestedArray.reduce((previousValue, currentValue) => previousValue.concat(currentValue), []);
console.log(flattenedArray);

Output

[1, 2, 3, 4, 5, 6]

Summary

In this TypeScript tutorial, we learned about reduce() method of Array: the syntax and few working examples with output and detailed explanation for each example.