Как читать функциональную композицию в es6/javascript?

Question

фона:

Композиция ставит две функции вместе, чтобы сформировать третью функцию, где выход одной функции является входом другого.

Независимо от того, насколько я смотрю на это, я борюсь с тем, как его читать. В частности, почему compose() возвращает => (a) =>, фиксирует 121.2121212 в локальной области. Также я борюсь с тем, как будет выглядеть окончательный fn f(g(a)) со всеми значениями/fn, присутствующими без использования переменных.

Вопрос: У кого-нибудь есть методы или диаграммы для быстрого чтения таких примеров; как я могу мысленно отлаживать и следить за потоком функций?

Reference:

const compose = (f, g) => (a) => f(g(a)) // Definition 
const floorAndToString = compose((val) => val.toString(), Math.floor) // Usage 

floorAndToString(121.212121) // '121' 

Answer 1

Как отметил T.J. Crowder, он часто помогает переписывать функции стрелок как обычные функции.Поэтому функции:

const compose = (f, g) => (a) => f(g(a)) 

можно переписать в виде:

function compose (f, g) { 
    return function (a) { 
     return f(g(a)); 
    } 
} 

Теперь, возможно, более очевидным, что происходит. Итак, теперь давайте перепишем другие части:

const floorAndToString = compose((val) => val.toString(), Math.floor) 

можно переписать в виде:

function convertToString (val) { return val.toString() }; 

const floorAndToString = compose(convertToString, Math.floor); 

Теперь это может быть более очевидным, что функция compose возвращает функцию:

// remember that we pass `convertToString` as `f` 
// and `Math.floor` as `g`: 

function (a) { 
    return convertToString(Math.floor(a)); 
} 

Так очевидно, что функция floorAndToString просто возвращает результат convertToString(Math.floor(a)). Нет ничего особенного в compose, который фиксирует 121.2121212, потому что это не так. Вместо этого он создает функцию, в которой 121.2121212 может быть передан как аргумент convertToString(Math.floor(a)).

Answer 2

Это может помочь взглянуть на статью Википедии для function composition. Но я думаю, что ваша проблема не связана с составом функций, а с обозначением стрелки в целом.

Может быть, это помогает смотреть на более простом примере первого:

const addOne = (x) => x + 1 
const addN = (n) => (x) => x + n 
const addSeven = addN(7) 

Последняя строка создает новую функцию, которая добавляет семь к входу (x) => x + 7. Вы можете думать о параметрах кортежей между стрелками как заполненных слева направо, когда предоставляются значения (а переменные справа привязаны к этим значениям). Пока вы не предоставляете все параметры, вы получите новую функцию.

Вы также можете указать все параметры, как это:

addN(5)(3) // yields 8 

Обратите внимание, что Addn можно рассматривать как принимать два параметра, но в отдельных пар скобок. Стрелки между скобками в определенном виде позволяют вам опустить параметры справа и получить функцию с меньшим количеством параметров, при этом левые уже будут исправлены.

Давайте посмотрим на альтернативное определение композе:

const weirdCompose = (f, g, a) => f(g(a)) 

Это должно быть понятно, как это работает, но проблема в том, что вы не можете использовать это, чтобы составить две функции без оценки результата композиции с значение a сразу. Разделив параметры на две группы, вы можете выполнить partially apply и предоставить только f и g.

Чтобы лучше это понять, я предлагаю вам также взглянуть на концепцию currying