89 votes

TypeScript et la fonction de réduction des tableaux

Savez-vous ce que le reduce fait en TypeScript ? Pouvez-vous fournir un exemple simple d'utilisation ?

J'ai cherché sur Google et le Spécification du langage TypeScript mais je n'ai pas pu trouver d'explication et d'exemples décents.

129voto

Quentin 2 Points 188

Juste une remarque en complément des autres réponses.

Si une valeur initiale est fournie à la réduction, son type doit parfois être spécifié, c'est-à-dire que

a.reduce(fn, [])

peut devoir être

a.reduce<string[]>(fn, [])

ou

a.reduce(fn, <string[]>[])

76voto

JohnnyHK Points 61191

C'est en fait le tableau JavaScript reduce plutôt que d'être quelque chose de spécifique à TypeScript.

Comme décrit dans les docs : Appliquer une fonction contre un accumulateur et chaque valeur du tableau (de gauche à droite) afin de le réduire à une seule valeur.

Voici un exemple qui résume les valeurs d'un tableau :

let total = [0, 1, 2, 3].reduce((accumulator, currentValue) => accumulator + currentValue);
console.log(total);

L'extrait devrait produire 6 .

18voto

hlo Points 77

Avec les génériques TypeScript, vous pouvez faire quelque chose comme ceci.

class Person {
    constructor (public Name : string, public Age: number) {}
}

var list = new Array<Person>();
list.push(new Person("Baby", 1));
list.push(new Person("Toddler", 2));
list.push(new Person("Teen", 14));
list.push(new Person("Adult", 25));

var oldest_person = list.reduce( (a, b) => a.Age > b.Age ? a : b );
alert(oldest_person.Name);

9voto

Energy Points 62

Réduire() est..

  • La méthode reduce() réduit le tableau à une seule valeur.
  • La méthode reduce() exécute une fonction fournie pour chaque valeur de le tableau (de gauche à droite).
  • La valeur de retour de la fonction est stockée dans un accumulateur. (résultat/total).

C'était

let array=[1,2,3];
function sum(acc,val){ return acc+val;} // => can change to (acc,val)=>acc+val
let answer= array.reduce(sum); // answer is 6

Changer pour

let array=[1,2,3];
let answer=arrays.reduce((acc,val)=>acc+val);

Vous pouvez également utiliser dans

  1. trouver le maximum

    let array=[5,4,19,2,7];
    function findMax(acc,val)
    {
     if(val>acc){
       acc=val; 
     }
    }
    
    let biggest=arrays.reduce(findMax); // 19
  2. trouver un élément qui n'est pas répété .

    arr = [1, 2, 5, 4, 6, 8, 9, 2, 1, 4, 5, 8, 9]
    v = 0
    for i in range(len(arr)):
    v = v ^ arr[i]
    print(value)  //6

2voto

Kangur Points 2412

+1 pour la réponse de @JohnnyHK selon laquelle il s'agit d'une fonction Javascript standard.

J'ai atterri ici parce que j'ai eu quelques problèmes pour taper cette fonction, donc je vais laisser mes conclusions ici. Si vous avez un IDE standard, si vous cliquez sur reduce vous obtiendrez les définitions de type correspondantes.

/**
 * Calls the specified callback function for all the elements in an array. The return value of the callback function is the accumulated result, and is provided as an argument in the next call to the callback function.
 * @param callbackfn A function that accepts up to four arguments. The reduce method calls the callbackfn function one time for each element in the array.
 * @param initialValue If initialValue is specified, it is used as the initial value to start the accumulation. The first call to the callbackfn function provides this value as an argument instead of an array value.
 */
reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T): T;
reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T;

/**
 * Calls the specified callback function for all the elements in an array. The return value of the callback function is the accumulated result, and is provided as an argument in the next call to the callback function.
 * @param callbackfn A function that accepts up to four arguments. The reduce method calls the callbackfn function one time for each element in the array.
 * @param initialValue If initialValue is specified, it is used as the initial value to start the accumulation. The first call to the callbackfn function provides this value as an argument instead of an array value.
 */
reduce<U>(callbackfn: (previousValue: U, currentValue: T, currentIndex: number, array: T[]) => U, initialValue: U): U;

Le premier ensemble est destiné à réduire le tableau des T au T la valeur elle-même.

Il y a aussi un deuxième usage, mentionné par @Quentin, qui est que vous pourriez vouloir réduire le tableau de T à un autre type. Le plus souvent, je l'ai vu être utilisé comme :

const keyToValMap = [{key: 'k1', val: 1}].reduce<Record<string, number>>((map, el) => {
  map[el.key] = el.val;
  return map
}, {})

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X