JavaScript函数式编程

1：基本概念

函数式编程是一种编程思惟方式，并非一些语法规则，对于复用性高的功能代码进行必定的函数封装，实现了代码的高可复用性（主要目的）。

函数式编程的特色：

• 函数是第一等公民，由于叫函数式编程，所以函数的地位是最高的，也就是说比起变量函数的地位更高一点。

• 只用表达式而不用语句，表达式就是声明式的意思，语句就是命令式的，尽可能使用表达式或者是声明式的代码来组织逻辑。

• 没有反作用的代码，也叫作纯函数或者在一些开发框架中也叫做纯主键，纯的意思是输入必定那么输出也必定。

• 不修改状态。

• 引用透明。

2：函数是一等公民

理解：函数在整个JavaScript代码里面通常来说有四种，第一种叫作声明函数、而后是表达式函数、匿名函数以及自执行函数。

为何函数是一等公民？

• 函数声明优先级高于变量声明和函数表达式

  console.log(getName);
  ​
  getName();
  ​
  var getName;
  getName = 'Eric';
  function getName(){
      console.log('function getName');
  }
  ​
  console.log(getName);
  ​
  //ƒ getName(){
      console.log('function getName');
    }
  // function getName
  // Eric

• 函数应用

  //声明函数
  function getName(){
  }
  ​
  //表达式函数(直接赋给一个变量)
  var getName = function(){
  }
  ​
  //匿名函数(没有名字)
  setTimeout(function(){
  },1000);
  ​
  //自执行函数(IIFE)
  (function(){
  })();

3：纯函数

特色：

• 对于相同的输入，永远会获得相同的输出

  function getNumber(num){
      return num + Math.random();
  }

• 不改变输入值

  function getGirlGift(list){
      // 输入值改变
      list = list.map(girl => {
          girl.gift = girl.age > 18 ? 'big' : 'small';
      });
      return list;
  }

• 不包含反作用（网络、I/O）

  var array = \[1,2,3,4,5\];
  array.slice(0,3);
  array.slice(0,3);
  // \[1, 2, 3\]
  ​
  // 改变原数组
  array.splice(0,3);
  array.splice(0,3);
  // \[4, 5\]
  ​
  //网络请求
  asiox.get('https://www.xxxx.com').then(res => {
      
  })
  ​
  //时间
  function getDate(){
      return new Date();
  }

• Array函数举例

  以数组为例，纯与不纯函数有哪些：
  //不纯：调用数组以后改变了原数组。
  array.push();       数组尾部插入
  array.pop();        删除并返回数组最后一个元素
  array.unshift();    数组头部插入
  array.shift();      删除并返回数组第一元素
  array.splice();     删除元素，并向数组添加元素
  array.reverse();    颠倒数组元素的顺序
  array.sort();       排序数组元素
  ​
  ​
  //数组纯函数：调用数组的方法不改变原数组。
  array.slice();      数组中返回选定的元素
  array.concat();     链接数组，并发挥新数组
  array.join();       按分隔符链接数组，返回字符串

4：函数柯里化

定义：传递给函数的一部分参数来调用它，让它返回一个函数去处理剩下的参数。

柯里化是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，而且返回接受余下的参数并且返回结果的新函数的技术。例如：

// 普通的add函数
function add(x, y) {
    return x + y
}
add(1,2);
// 3
​
// 柯里化改编后
function addX(y) {
    return function (x) {
        return x + y;
    }
}
addX(2)(1);
// 3
​
// 函数不纯 \- 硬编码 \- 依赖min参数 
var min = 90; 
var isWell = score => score > min;
​
// 柯里化改编 
var min = 90; 
var chekoLevel = baseLine => (score => score > baseLine);
var isWell = chekoLevel(90);
// isWell(90)
   false
// isWell(940)
   true
​
​
实际上就是把add函数的x，y两个参数变成了先用一个函数接收x而后返回一个函数去处理y参数。如今思路应该就比较清晰了，就是只传递给函数一部分参数来调用它，让它返回一个函数去处理剩下的参数。

一种对参数的缓存

• 用在一些区分环境的函数预缓存

• 已获取某些耗时操做结果缓存

5：函数组合

在函数式编程思想以前，出现过一个函数嵌套的现象，函数嵌套是一个函数的执行结果它是另一个函数的入参，通常来说是两层，可是两层以上或者更多也是可能的。好比下面的代码，它的意思是function13的结果做为function2的入参，而后function2的结果又做为function1的入参。这样的写法不太好理解并且容易混乱，所以在这个基础上，衍生了函数式编程的另一个思想，叫作函数组合。

函数组合是经过另一个函数去组合嵌套函数，可是函数自己的嵌套关系，依赖关系是不会改变的。只不过是经过另一个函数完成一个组装。

• 函数嵌套

  function1(function2(function13(x)));

• 函数组合

  var compose = (function1, function2) => (x => function1(function2(x)));
  ​
  var function1 = param => param + 1;
  var function2 = param => param + 2;
  var final = compose(function1, function2);
  final(1);
  ​
  // 4

6：Point Free

不要命名转瞬即逝的中间变量。

var getSplitWord = str => str.toUpperCase().split(' ');

//柯里化封装
var toUpperCase = word => word.toUpperCase();
var split = x => str => str.split(x);
var getSplitWord = compose(split(' '), toUpperCase);

7：声明式代码

var students = \[{
    name: 'Eric',
    score: 99,
    },
    {
        name: 'Iven',
        score: 59,
    }
}\];
​
//命令式
const getWell =students => {
    let result = \[\];
    for (let i = 0; i < students.length; i++){
        if (students\[i\].score >= 90){
            result.push(students\[i\])
        }
    }
    return result;
}
​
//声明式
const getWell = students => return students.filler(student => students.score >= 90);

8：高阶函数

把函数当参数，把传入的函数作一个封装。

function add(x,y,f){
    return f(x) + f(y);
}

高阶函数是对其余函数进行操做的函数，能够将它们做为参数或返回它们。 简单来讲，高阶函数是一个函数，它接收函数做为参数或将函数做为输出返回。

常见的高阶函数有：

• Array.map

  var array = \[1,2,3\];
  array.map(s => s + 1);
  // \[2, 3, 4\]

• Array.sort（排序）

• Array.filter（过滤）