Der Inhalt dieses Artikels befasst sich mit dem Verständnis der Codekomposition (Komposition) in der funktionalen JavaScript-Programmierung. Ich hoffe, dass er für Freunde hilfreich ist.
Wie versteht man die Codekomposition (Compose) in der funktionalen Programmierung?
Definition: Wie der Name schon sagt, besteht Compose in der funktionalen Programmierung darin, mehrere unterschiedliche Funktionen zusammenzusetzen und zu kombinieren, eine zu generieren Brandneue Funktion
Code-Verständnis:
// 一个将小写转大写的函数
let toUpperCase = (x) => x.toUpperCase();
// 一个在字符后加！的函数
let exclaim = (x) => x + '!';
// 将两个函数组合起来, 这里假设我们实现了compose
let shout = compose(toUpperCase,exclaim);
shout('js每日一题') // JS每日一题 !, 显示结果里上面两个函数的特点都应用上了Es gibt ein wichtiges Konzept punktfrei in der Codekombination (verraten Sie niemals Ihre Daten), es bedeutet, dass die Funktion dies nicht tut Ich muss erwähnen, mit welchen Daten es arbeiten wird
Es ist etwas unklar, schauen wir uns den Code an, um es zu verstehen
// 我们有一个将字符转换成大写并且将其空格转换为'-'的函数 // 细节的同学应该发现这个函数暴露了一个word形参 // 根据pointfree定义，此函数非pointfree模式 let snakeCase = (word) => word.toUpperCase().replace(/\s+/ig,'-'); // 下面这个函数与上面的功能一致，但我们可以观察到其没有数据暴露,所以其为pointfree模式 let snakeCase = compose(replace(/\s+/ig,'-'),toUpperCase)
Nachdem ich so viel gesagt habe, was kann es helfen? Wir reduzieren unnötige Benennungen und halten den Code einfach und allgemein.
Oben gehen wir alle davon aus, dass die Compose-Methode bereits existiert. Als Nächstes werden wir sie implementieren
Analysieren Sie zunächst ihre Eigenschaften
basierend auf dem obigen Beispiel und den von uns analysierten Merkmalen zur Implementierung einer einfachsten Version von
// 这样子其实就能满足我们上面示例的要求了
const compose = function(f, g) {
return function(x) {
return f(g(x));
};
};abgeschlossen? Beispiel oben Es werden nur zwei Funktionen übergeben, da unsere vereinfachte Compose-Implementierung nur zwei Funktionen unterstützt. Wenn wir also eine sehr lange Pipeline unterstützen möchten, reicht das obige Compose offensichtlich nicht aus, und dann werfen wir einen Blick auf die Compose-Implementierung von die ausgezeichnete Open-Source-Bibliothek redux
// 摘自 https://github.com/reactjs/redux/blob/master/src/compose.js
export default function compose(...funcs) {
// 没有传入函数运行直接返回参数
if (funcs.length === 0) {
return arg => arg
}
// 只传入一个函数，就返回其本身
if (funcs.length === 1) {
return funcs[0]
}
// 核心代码其实就是一句reduce, reduce特性就是按顺序执行，并且将结果传递给下一次执行, 这里多说一句, reduce顺序执行多个相依赖的promise也很好用
return funcs.reduce((a, b) => (...args) => a(b(...args)))
}Zusammenfassung
Eine Funktion, die mehrere Einzelfunktionsfunktionen miteinander kombiniert
Mehrere Die Funktion dient einem Datensatz (gemeinsame Parameter)
Keine Daten erforderlich (punktfrei)
Die Funktionen werden sequentiell von rechts nach links ausgeführt und das Ergebnis wird als Parameter der nächsten Funktion verwendet
Dieser Artikel ist hier zu Ende. Weitere spannende Inhalte finden Sie in der Spalte JavaScript-Tutorial-Video auf der chinesischen PHP-Website!
Das obige ist der detaillierte Inhalt vonVerständnis der Codezusammensetzung (Compose) in der funktionalen JavaScript-Programmierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
