Maison  >  Article  >  interface Web  >  Introduction détaillée à quelques réflexions sur le currying des fonctions JavaScript

Introduction détaillée à quelques réflexions sur le currying des fonctions JavaScript

黄舟
黄舟original
2017-03-08 14:20:031250parcourir

1. Pièges des fonctions d'ordre supérieur

Avant d'apprendre le curry, examinons d'abord le morceau de code suivant :

var f1 = function(x){
    return f(x);
};
f1(x);

De nombreux étudiants le peuvent. On voit que ces écritures sont très idiotes, car les fonctions f1 et f sont équivalentes. On peut simplement écrire var f1 = f; directement. Il n'est pas nécessaire de l'envelopper dans une telle couche.

Cependant, vous ne pourrez peut-être pas voir le problème avec le morceau de code suivant :

var getServerStuff = function(callback){
  return ajaxCall(function(json){
    return callback(json);
  });
};

Il s'agit d'un morceau de code que j'ai extrait du "Guide de programmation fonctionnelle JS". en fait, en utilisant À partir des règles ci-dessus, nous pouvons conclure que callback est équivalent à la fonction

function(json){return callback(json);};

, donc la fonction peut être simplifiée en :

var getServerStuff = function(callback){
  return ajaxCall(callback);
};

Continuer à simplifier :

var getServerStuff = ajaxCall;

De cette façon, nous avons découvert qu'un programme aussi long avait été écrit en vain.

La fonction peut être utilisée à la fois comme paramètre et comme valeur de retour. C'est une caractéristique importante des fonctions d'ordre élevé, mais il est facile d'entrer dans une fosse si vous ne faites pas attention.

2. Fonction curry (curry)

Pour en venir au fait, qu'est-ce que la fonction curry ? La fonction curry consiste à appeler une fonction en transmettant seulement une partie de ses paramètres et à lui faire renvoyer une fonction pour gérer les paramètres restants. Cela semble déroutant, mais c'est en fait très simple, cela signifie diviser les variables de la fonction et l'appeler : f(x,y,z) -> f(x)(y)(z).

Pour l'exemple initial, implémentez-le comme suit. Deux paramètres doivent être transmis. La méthode d'appel f1 est f1(f,x).

var f1 = function(f,x){
    return f(x);
};

Notez que puisque f est transmis en tant que variable de fonction, f1 devient une nouvelle fonction.

Nous allons changer f1 et utiliser fermeture pour l'écrire sous la forme suivante, puis la méthode d'appel f1 devient f1(f)(x), et les résultats obtenus sont exactement les mêmes. Ceci termine le curry de f1.

var f1 = function(f){
    return function(x){
        return f(x);
    }
};
var f2 = f1(f);
f2(x);

En fait, cet exemple est inapproprié. Les étudiants attentifs peuvent constater que même si f1 est une nouvelle fonction, f2 et f sont complètement équivalents. , ou est venu.

Voici un exemple très classique :

['11', '11', '11'].map(parseInt) //[ 11, NaN, 3 ]
['11', '11', '11'].map(f1(parseInt)) //[ 11, 11, 11 ]

Puisque parseInt accepte deux paramètres, il y aura des problèmes de conversion hexadécimale lors de l'appel direct. Veuillez vous référer à "Ne veut pas être séparé". article.

var f2 = f1(parseInt), f2 fait parseInt passer de l'acceptation de deux paramètres à une nouvelle fonction qui n'accepte qu'un seul paramètre, résolvant ainsi ce problème de conversion hexadécimale. Après avoir réussi notre package f1, vous pourrez exécuter les bons résultats.

Certains étudiants estiment qu'il ne s'agit pas d'une candidature au curry. Je pense que cela devrait être pris en compte. Tous les étudiants peuvent en discuter ensemble.

3. Réflexions supplémentaires sur le currying de fonctions

Si nous prenons l'exemple de la section précédente, au lieu d'exécuter f(x) directement, nous traitons la fonction f comme un paramètre. , quel sera le résultat ? Regardons l'exemple suivant :

Supposons que f1 renvoie la fonction g, la portée de g pointe vers xs et la fonction f sert de paramètre de g. Finalement, on peut l'écrire sous la forme suivante :

var f1 = function(f,xs){
    return g.call(xs,f);
};

En fait, utiliser f1 pour remplacer g.call(xxx) s'appelle décurrying. Par exemple :

var forEach = function(xs,f){
    return Array.prototype.forEach.call(xs,f);
};
var f = function(x){console.log(x);};
var xs = {0:'peng',1:'chen',length:2};
forEach(xs,f);

L'anti-curring consiste à différer les paramètres fixes d'origine ou ce contexte comme paramètres vers le futur.
Cela peut grandement simplifier les fonctions, à condition de s'y habituer.

Dé-curry à part, et si on voulait faire du curry f1 ?

En utilisant la fermeture, nous pouvons l'écrire sous la forme suivante :

var f1 = function(f){
    return function(xs){
        return g.call(xs,f);
    }
};
var f2 = f1(f);
f2(xs);

Passer f dans f1, et nous pouvons obtenir la nouvelle fonction f2.

Ne transmettre qu'une partie des paramètres à la fonction est généralement appelé une application partielle, ce qui peut réduire considérablement le code passe-partout.

Bien entendu, les deux paramètres transmis par la fonction f1 ne doivent pas nécessairement inclure une fonction ou une non-fonction. Ils peuvent tous deux être des fonctions, ou les deux peuvent être des non-fonctions. .

Personnellement, je pense que le curry n'est pas nécessaire et que les étudiants inconnus peuvent avoir du mal à le lire, mais cela peut nous aider à comprendre la programmation fonctionnelle en JS, et plus important encore, nous le ferons. Vous ne vous sentirez pas étranger en lisant un code similaire . Luo Chen sur Zhihu l'a très bien dit :

Ce n'est pas que le "currying" ait un sens pour la programmation fonctionnelle. Au contraire, même si la programmation fonctionnelle traite les fonctions comme des citoyens de première classe, elle produira inévitablement l'usage du « curry ». Cela ne se produit donc pas parce que « cela a du sens ». Bien sûr, puisqu’il existe, on peut naturellement explorer comment utiliser ce phénomène.

Exercice :

// 通过局部调用(partial apply)移除所有参数
var filterQs = function(xs) {
  return filter(function(x){ return match(/q/i, x);  }, xs);
};
//这两个函数原题没有,是我自己加的
var filter = function(f,xs){
    return xs.filter(f);
};
var match = function(what,x){
    return x.match(what);
};

Analyse : La fonction de la fonction filterQs est de passer dans un tableau de chaînes, de filtrer les chaînes contenant 'q' et de former un A un nouveau tableau est renvoyé.

Nous pouvons obtenir la fonction filterQs à travers les étapes suivantes :

a. filter传入的两个参数,第一个是回调函数,第二个是数组,filter主要功能是根据回调函数过滤数组。我们首先将filter函数柯里化:

var filter = function(f){
    return function (xs) {
        return xs.filter(f);
    }
};

b. 其次,filter函数传入的回调函数是matchmatch的主要功能是判断每个字符串是否匹配what这个正则表达式。这里我们将match也柯里化:

var match = function(what){
    return function(x){
        return x.match(what);
    }
};
var match2 = match(/q/i);

创建匹配函数match2,检查字符串中是否包含字母q。

c. 把match2传入filter中,组合在一起,就形成了一个新的函数:

var filterQs =  filter(match2);
var xs = ['q','test1','test2'];
filterQs(xs);

从这个示例中我们也可以体会到函数柯里化的强大。所以,柯里化还有一个重要的功能:封装不同功能的函数,利用已有的函数组成新的函数。

4. 函数柯里化的递归调用

函数柯里化还有一种有趣的形式,就是函数可以在闭包中调用自己,类似于函数递归调用。如下所示:

function add( seed ) {
    function retVal( later ) {
        return add( seed + later );
    }
    retVal.toString = function() {
        return seed;
    };
    return retVal;
}
console.log(add(1)(2)(3).toString()); // 6

add函数返回闭包retVal,在retVal中又继续调用add,最终我们可以写成add(1)(2)(3)(...)这样柯里化的形式。
关于这段代码的解答,知乎上的李宏训同学回答地很好:

每调用一次add函数,都会返回retValue函数;调用retValue函数会调用add函数,然后还是返回retValue函数,所以调用add的结果一定是返回一个retValue函数。add函数的存在意义只是为了提供闭包,这个类似的递归调用每次调用add都会生成一个新的闭包。

5. 函数组合(compose)

函数组合是在柯里化基础上完成的:

var compose = function(f,g) {
  return function(x) {
    return f(g(x));
  };
};
var f1 = compose(f,g);
f1(x);

将传入的函数变成两个,通过组合的方式返回一个新的函数,让代码从右向左运行,而不是从内向外运行。

函数组合和柯里化有一个好处就是pointfree。

pointfree 模式指的是,永远不必说出你的数据。它的意思是说,函数无须提及将要操作的数据是什么样的。一等公民的函数、柯里化(curry)以及组合协作起来非常有助于实现这种模式。

// 非 pointfree,因为提到了数据:name
var initials = function (name) {
  return name.split(' ').map(compose(toUpperCase, head)).join('. ');
};

// pointfree
var initials = compose(join('. '), map(compose(toUpperCase, head)), split(' '));

initials("hunter stockton thompson");
// 'H. S. T'

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn