Master the JavaScript Interview: What is Functional Programming?

define

Functional Programming is a Programming paradigm, that is, Programming based on principles. Object Oriented Programming and Procedure Programming are also Programming paradigms.

The main principles of functional programming are as follows:

  • Use pure functions
  • Function composition
  • Avoid shared States
  • Avoid mutable data
  • Avoid side-effects
  • Use declarative instead of imperative

The principle of

1. Pure functions

Pure functions need to satisfy:

  • The same parameter must return the same value

    Reference transparency: Functions operate without dependence on external variables or state, only on input parameters. As long as the arguments are the same, the function always returns the same value.

  • No side effects

    Side effect: The function interacts internally and externally, producing results other than the operation. For example, when changing the value of a global variable.

Such as:

var arr = [1.2.3.4.5];
// array. slice is a pure function because it has no side effects. For fixed inputs, the output is always fixed
arr.slice(0.3);

// array.splice is not a pure function. The return value is not fixed.
arr.splice(0.3); / / = > [1, 2, 3]
arr.splice(0.3); / / = > [4, 5]
Copy the code

2. Function combination

Function composition is the combination of two or more functions to generate a new function or perform a calculation.

Let’s say I combine f and g to form f of g of x.

var compose = (f, g) = > (x= > f(g(x)))
var add1 = x= > x + 1
var mul5 = x= > x * 5
compose(mul5, add1)(2) / / 15
Copy the code

3. Avoid sharing

Shared state is any variable, object, or storage that is passed as an object property in a shared scope (such as a global scope, closure scope) or between scopes.

When shared state is avoided, the timing and order in which functions are executed does not affect the result.

const x = {
  val: 2
};
// Use object. assign to copy the attributes of x to an empty Object to avoid direct changes to x
const x1 = x= > Object.assign({}, x, { val: x.val + 1});
const x2 = x= > Object.assign({}, x, { val: x.val * 2});
console.log(x1(x2(x)).val); / / 5

const y = {
  val: 2
};

// Functions can be called in any order and at any time without changing the results of other functions
x2(y);
x1(y);

console.log(x1(x2(y)).val); / / 5
Copy the code

4. Avoid mutable data

An immutable object cannot be modified after it is created. Immutability is a central concept of functional programming. Without immutability, data flows are incomplete and can lead to bugs.

Note that an object declared by const cannot be reassigned, but its properties can be modified, so it is mutable.

Avoid side effects

A side effect is any change in state that is visible outside the function except for the value returned by the function. Such as:

  • Modify external variables, or properties of objects (global variables, or variables of the parent function in the scope chain)
  • Log output to the console
  • Put it on screen
  • Write to file
  • Upload to the network
  • Triggering external processes
  • Call other functions with side effects

Avoiding side effects makes the code easier to understand and easier to test. In functional programming, you need to separate side effects from the rest of the logic to make your program easier to extend, refactor, debug, test, and maintain. This is why many front-end frameworks now encourage users to manage state and render components in separate, low-coupling modules.

6. Declarative vs. imperative

Functional programming is a declarative paradigm.

Imperative describes the operation steps to achieve some goal, that is, describes the flow control, that is, how to do it.

Declarative describes a data flow. That’s what you do.

For example, to double all the values in an array, the command describes the detailed steps:

const doubleMap = numbers= > {
  const doubled = [];
  for (let i = 0; i < numbers.length; i++) {
    doubled.push(numbers[i] * 2);
  }
  return doubled;
};
Copy the code

Declarative, using an expression that more clearly and briefly describes the data flow:

const doubleMap = numbers= > numbers.map(n= > n * 2);
Copy the code

Imperative statements, such as for, if, switch, etc., are used to indicate what action to perform.

Declarative expressions often use expressions, usually combining function calls, values, operators, etc., in order to find a value. Such as math.max (4, 3, 2).

read

Curry and Function Composition

JavaScript Functional Programming (PART 1)