Comment le curry fonctionne-t-il avec plusieurs fonctions fléchées en JavaScript ?

Currying avec plusieurs fonctions de flèches en JavaScript

Vous pouvez rencontrer du code comme celui-ci dans les applications React :

handleChange = field => e => {
  e.preventDefault();
  /// Do something here
}

Cette syntaxe déroutante représente ce qu'on appelle un curry fonction.

Qu'est-ce que le Currying ?

Le Currying est une technique qui permet de définir une fonction en plusieurs parties. Par exemple :

const add = x => y => x + y

C'est équivalent à la fonction traditionnelle :

const add = function (x) {
  return function (y) {
    return x + y
  }
}

Se concentrer sur la valeur de retour

Dans les fonctions fléchées, la valeur de retour est représentée par :

const f = someParam => returnValue

Par conséquent, notre fonction add renvoie un function :

const add = x => (y => x + y)

Appel de la fonction :

add(2)(3)  // returns 5

Cela se produit car l'appel de la fonction externe renvoie la fonction interne.

Comprendre le code handleChange

Appliquer ceci au handleChange code :

handleChange = function(field) {
  return function(e) {
    e.preventDefault()
    // Do something here
  };
};

Étant donné que les fonctions fléchées préservent le contexte, cela ressemble effectivement à :

handleChange = function(field) {
  return function(e) {
    e.preventDefault()
    // Do something here
  }.bind(this)
}.bind(this)

Ce code crée une fonction pour un champ spécifique. Dans React, il est utilisé pour configurer des écouteurs pour divers champs de saisie sans dupliquer le code.

Fonctions fléchées multiples

Plusieurs fonctions fléchées peuvent être séquencées, permettant des fonctionnalités surprenantes comme ceci :

const $ = x => k =>
  $ (k(x))

Cette fonction curry, appelée $ (comme un jeu de mots sur la syntaxe Lisp), semble accepter un nombre arbitraire de arguments, faisant abstraction du concept d'arité.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!