
[The introduction for functions compose is here](/post/functions-compose).

> **Definition : Functions Compose** \
> compose = (funa, funb) => (c) => funa(funb(c));

Now we are supposed to give the proof and derivation process of the following conclusions

> **Associate Law For Functions Compose** \
> compose((funa, funb), func)) = compose(funa, (funb, func))

It's simple to prove this proposition with the definition of functions compose.

according to

```javascript
compose(a, b) = (D) => a(b(D));
```

We assign the argument `b` with

```javascript
b = compose(x, y);
```

So we get

```javascript
compose(a, b) = compose(a, compose(x, y))
= (D) => a(compose(x, y))
= (D) => a(x(y(D)))
```

We find that

```javascript
(D) => a(x(y(D)))
= (D) => compose(compose(a,x),y)
```

So we have the conclusion

```javascript
compose(compose(a, x), y) = compose(a,compose(x, y));
```

QED.

We logically have the expanded conclusion: If there are n function combinations

$$
compose(...,a_{i},a_{i+1},...,compose(a_{j},a_{j+1},...),...,a_{n}) \\ = compose(...,a_{x},a_{x+1},...,compose(a_{y},a_{y+1},...),...,a_{n}); \\
i,j,x,y∈(0,n];

j-i = y-x
$$

The proof of this proposition is omitted.


The derivation process for functions compose

Associate Law For Functions Compose


The `function compose` borrowed thinking from pipeline in Unix-Shell Programming with taking out of a function's output as other function's input.

For example,

```bash
# The content of test.txt is 'Hello'
cat test.text | grep 'World'
# Output : Hello World
```

At above example the symbol `|` is treated as pipeline operator, it transfer the left output to right input.

So the compose in Functional Programming is simply defined as following implement in javascript

```javascript
const compose = (funa, funb) => (c) => funa(funb(c));
```

The compose function accepts two functions as arguments and returns new function that accepts an initial input and applys functions one by one.

In fact the above definition has same effects with

```javascript
const temp = funb(data);
const result = funa(temp);
```

Bear in mind that the order of function calls is inside out and appears in `compose` function is from right to left.

We also have expansion definition for multiple functions compose

```javascript
const composeN =
  (...funcs) =>
  (data) =>
    reduce(funcs.reverse(), (acc, fn) => fn(acc), value);
```


Definitions and examples for Functions Compose

Functions Compose


### Unary, Binary and Variadic

**Definition :** The function that only applies and receives one argument value.

For example, this is a typical unary

```javascript
const func = (para) => para;
```

Corresponding the defination of **Binary** : The function that applies and receives two argument values. We could expand this defination into the **Variadic** : The function that applies and recieves multiple argument values.

```javascript
const add = (x, y) => x + y; // Binary Function
const sum = (...args) => args.reduce((acr, cur) => acr + cur); // Variadic Function
```

### Currying

**Definition :** The currying is the process that transform a variadic into a nested unary.

It may be difficult to understand only by reading at this definition. Here is a detailed explanation by example.

We have an add function:

```javascript
const add = (a, b) => a + b;
```

It applies two argument values to get its sum. But if we need to apply this function for multiple arguments, it should be rewrite as:

```javascript
const add = (...args) => {
  let sum = 0;
  for (val of args) {
    sum += val;
  }
  return sum;
};
```

However, it pulls in a temporary variable `sum` to store the amount while traversing the array, it also called as `State`.

The one of the principles in functional programming is avoid pulling state into program for it may make effects, which causes bugs to make harder debugging.

So we should remove the state variable `sum` by currying.

For example, the Binary function of sum :

```javascript
const add = (a, b) => a + b;
```

We rewrite it such as:

```javascript
const add = (a) => (b) => a + b;
```

When I want to get the sum of 2 and 3:

```javascript
add(2)(3); // 5
```

The function calling process:

```javascript
add(2); // return a function (b) => (b + 2)
add(2)(3); // call to a function returned by the previous layer (3) => (3 + 2) , the b is assigned as 3.
```

Similarly, if we have three arguments, the currying should like:

```javascript
const add = (a) => (b) => (c) => a + b + c;
```

The javascript supports variadic functions, we could derive a generator functions for currying:

```javascript
const curry = (func) => {
  if (typeof func !== "function") {
    return;
  }
  return function curriedFn(...args) {
    if (args.length < func.length) {
      return curriedFn.apply(null, args.concat([].slice.call(arguments)));
    }
    func.apply(null, args);
  };
};
```

So we can curry a variadic functions by function `curry`;

```javascript
const add = (a, b, c) => a + b + c;
const curriedAdd = curry(add);
curriedAdd;
curriedAdd(1)(2)(3); // 6
```


Definitions and examples for Functions Currying

Functions Currying


_This post was [transported from zhihu answer](https://www.zhihu.com/question/528539234/answer/2444609012)._

_And origin question is:_

> In js, when a function is executed, it will be destroyed, and correspondingly, the scope of this function will also be destroyed. The form of closure is to return the function in the function, then use a variable in the global to accept the returned function, because the global variable will not be destroyed, and this variable holds the address of the returned function, so we can use this return function, because as long as there are variables or other things used inside the function, then this function will not be destroyed. So when we use the returned function in the global scope, then the main function will not be destroyed, the scope naturally exists, we can naturally use the variables in the function, and can save the state. I don't know if I understand it this way, right?

---

## Here is origin answer

> The form of closure is to return the function in the function, then use a variable in the global to accept the returned function, because the global variable will not be destroyed, and this variable holds the address of the returned function, so we can use this return function, because as long as there are variables or other things used inside the function, then this function will not be destroyed. So when we use the returned function in the global scope, then the main function will not be destroyed, the scope naturally exists, we can naturally use the variables in the function, and can save the state.

What you said is a so long paragraph, so let me first try to break down your understanding, and then analyze it slowly.

You say

> The form of closure is the return function in the function

That is wrong. JavaScript was originally designed with functional programming in mind, where functions are first-class citizens in the language. This means that functions can be stored in variables like any other type, passed as arguments to other functions, or returned as function execution values. **The function returns a function, which is determined by the language paradigm. Nothing to do with closures.**

**So to understand what the form of closure is, we must start with the definition. Its definition is given directly below,**

> A closure occurs when a function is executed outside of the lexical scope in which it was defined and can also remember and access the lexical scope in which it was defined.

According to the above definition, we can know the two characteristics of the closure,

- First, it executes outside the lexical scope in which it was defined.

- Second, it also has access to the lexical scope where it was defined.

It's a bit of a mouthful to say so, so let's give an example to illustrate.

first example,

```javascript
function fpp() {
  var a = 2;
  function bar() {
    console.log(a);
  }
  return bar;
}

var baz = foo(); // Hey, this is the effect of closure
```

The lexical scope of the `bar` function is within the `foo` function. But if the bar function is called directly outside the `foo` function, the compiler cannot find the definition of `bar` outside the `foo`, and therefore does not recognize `bar`, and will throw an error, indicating that `bar` is undefined. So if you want to execute the `bar` function outside the `foo` function, you can use `bar` itself as a return value, let the `baz` variable outside `foo` receive the `bar` function, and then execute it. In this way, the compiler can know that `bar` is stored in `baz` after `foo` is generated, so that the identity of `bar` is clear: it is a function. It can be executed outside of `foo`.

But according to the language setting of JavaScript, when a function is executed, it can access the lexical scope where it is located. For example, functions in the global scope can access global variables. Similarly, when the `bar` function is declared, it can access the scope where it is located, that is, within the `foo` function. And the scope in the `foo` function has a variable `a`, then this a variable can be directly accessed by the `bar` function during execution.

**But isn't this about functions returning functions? Then look at the second example**

```javascript
function foo() {
  var a = 2;
  function baz() {
    console.log(a);
  }
  bar(baz);
}

function bar(fn) {
  fn();
}
```

The `bar` function is declared outside of `foo`, `baz` is defined inside of `foo`, and the `foo` function can access `bar`. Now pass `baz` to the `bar` function, and `bar` will execute it after receiving it. At this time, `baz` is transferred to the scope execution in `bar` by passing, and can access a in the original scope, which is a closure. And it doesn't involve the problem of function returning function.

You see, in the first example above, the **`bar` function is executed after being stored in the `baz` variable outside the lexical scope, and can still access the variable a in the lexical scope, which creates a closure.**In the second example, **`baz` is passed to `bar` through parameters, so that it is executed outside the scope and can access a within the scope. This is also the most essential feature of closures.**

You say

> Because the global variable will not be destroyed, and this variable holds the address of the returned function, so we can use this returned function, because as long as there are variables or other things used inside the function, then this function will not be used destroy.

You are right in saying that global variables are not destroyed. But I don't understand what you want to say, maybe you want to say, as long as the reference of a function is not destroyed, then this function will not be destroyed? **However, in any case, whether the global variable will be destroyed or not has nothing to do with whether the closure will be destroyed...**

In the first example above, `baz` is defined globally. Stored is a reference to bar. `baz` will not be destroyed because it is defined globally, and it does not matter that `bar` and `foo` will not be destroyed.

So back to the second example

```javascript
function foo() {
  var a = 2;
  function baz() {
    console.log(a);
  }
  bar(baz);
}

function bar(fn) {
  fn();
}
```

The `bar` function is declared outside of `foo`, baz is defined inside of `foo`, and the `foo` function can access `bar`. Now pass `baz` to the `bar` function, and `bar` will execute it after receiving it. At this time, `baz` is transferred to the scope execution in `bar` by passing, and can access a in the original scope, which is a closure. **Here, `baz` is executed in the scope of `bar`, not globally, and there is no reference to `baz` in the global. But this is a closure, so `baz` won't be destroyed either.**

The closure will not be destroyed, it is determined by the JavaScript interpreter. **When the interpreter detects that a closure is generated during execution, the lexical scope where the closure is located will be circled by the interpreter and will never be destroyed. It's not because the closure is referenced globally and will not be destroyed, so the closure will not be destroyed either.** It has nothing to do with the global scope.

Understanding closures is a painstaking process. There are many pitfalls in this regard. The terminology of computer programming is more abstract. Therefore, it is recommended that when you come into contact with a concept, it is best to start with the definition and then contact specific examples, rather than start directly with the examples. \*\*Your sentence "the function returns a function" is most likely influenced by some tutorials on the Internet after directly throwing out examples.

Hope my answer is helpful to you.


Give the definition of closure in JavaScript and understand it by examples.

MY BLOG

FP

Associate Law For Functions Compose

Functions Compose

Functions Currying

Closure in JavaScript