前言

纯函数这个这个词我置信小伙伴们多多少少都据说过，它是函数式编程的根底。本文次要是对纯函数进行探讨，包含基本概念，长处，使用的经典案例以及咱们日常该如何去正当的应用等等。

纯函数的概念

首先咱们来看看纯函数的基本概念：

雷同的输出，总是会的到雷同的输入，并且在执行过程中没有任何副作用。

该怎么去了解下面的概念呢？咱们要把下面这句话拆成两局部来看。

雷同的输出，总是会失去雷同的输入。

来看看上面的例子：

let a = 1;function xAdd(x) {    return x + a;};xAdd(1); //2

下面这个函数就不是一个纯函数，因为在咱们程序执行的过程中，变量a很可能会产生扭转，当变量a产生扭转时，咱们同样执行xAdd(1)时失去的输入也就不同了。

再看另一个例子：

function sum(x, y) {    return x + y;};sum(1,2); //3

在这个例子中，合乎雷同的输出失去雷同的输入这个概念,sum是一个纯函数。

执行过程中没有任何副作用。

这里咱们要搞清楚什么是副作用，这里的副作用指的是函数在执行过程中产生了内部可察看变动。

  1. 发动HTTP申请
  2. 操作DOM
  3. 批改内部数据
  4. console.log()打印数据
  5. 调用Date.now()或者Math.random()

下面一系列操作都能够被称为是副作用。上面能够接着看一个批改内部数据从而产生副作用的例子：

let a = 1;function func() {    a = 'b';};func();console.log(a); // b

咱们运行了func函数，内部的变量a的值产生了扭转，这就是产生了所谓的副作用，所以func不是一个纯函数。当咱们这样进行批改：

function func2() {    let a = 1;    a = 'a';    return a};func(); // a

函数fun2不会对产生内部可察看变动，也就不会产生副作用，它就是一个纯函数。

一个纯函数，下面所说的两个条件缺一不可。

纯函数的益处

通过理解纯函数的概念，我置信有的小伙伴曾经能感觉到纯函数的一些的益处了：

  • 更容易进行测试，后果只依赖输出，测试时能够确保输入稳固
  • 更容易保护和重构，咱们能够写出品质更高的代码
  • 更容易调用，咱们不必放心函数会有什么副作用
  • 后果能够缓存，因为雷同的输出总是会失去雷同的输入

纯函数使用的经典案例

既然纯函数有这么多益处，那么咱们来看看有哪些使用纯函数的经典案例。

数组的根本办法

数组的很多根本办法都是纯函数，例如map,forEach,filter,reduce等等。

redux中的reducer

Redux中三大准则之一应用纯函数来执行批改，其中就使用了Reducer来形容 action 如何扭转 state tree。

Reducer 只是一些纯函数，它接管先前的 state 和 action，并返回新的 state。 --Redux
中文文档

Lodash

Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。我置信很多小伙伴也常常用到吧，这也是纯函数代表。

当然还有很多，这里就不一一举例了，总的来说，纯函数还是非常常见的。

咱们如何正当去应用

在理论开发中，咱们能够正当的去使用纯函数来进步咱们的开发效率和代码品质。

纯函数组件

咱们能够应用纯函数的的形式来创立组件：

function Header(props) {    return <h2>{props.text}</h2>}

比照一下应用Class(类)组件的形式创立组件：

class Header extends React.Component {  render() {    return <h1>{this.props.text}</h1>  }}

咱们能够总结出纯函数组件的一些长处：

  • 无副作用，咱们不必放心副作用带来的一些难以捕获的问题
  • 语法更简洁，可读性好，代码量绝对较小，易复用
  • 占用内存小，无生命周期和状态治理，晋升了性能

当然纯函数组件也有本人的毛病，例如：没有生命周期。

生命周期有时候并不可少，所幸当初咱们也曾经有了很好的解决方案——react-hooks。利用hooks函数，咱们能够在函数组件中应用等价于生命周期，状态治理等办法。

正当使用纯函数编写公共办法

在编写公共办法的时候，咱们尽量用纯函数来进行编写。

假如咱们要编写一个把数组中的小写字母转为大写字母的公共办法：

let lists = ["q","w","e"];let upperCaseLists = () => {    let arr = [];    for (let i=0, length= lists.length; i<length; i++) {        let item = lists[i];        arr.push(item.toUpperCase());    }    lists = arr;}

下面这个函数尽管能够实现逻辑复用，然而有副作用，必定是不适宜用来做公共办法的，所以咱们要优化它：

let upperCaseLists = (value) => {    let arr = [];    for (let i=0, length= value.length; i<length; i++) {        let item = value[i];        arr.push(item.toUpperCase());    }    return arr;}

应用可读性更好的forEach来优化：

let upperCaseLists = (value) => {    let arr = [];    value.forEach((item) => {        arr.push(item.toUpperCase());    })    return arr;}

持续用map进一步优化:

let upperCaseLists = (value) => {    return value.map((item) => item.toUpperCase())}

是不是很简洁？具体方法怎么优化要依据理论状况和业务需要来。

参考

https://segmentfault.com/a/11...

https://cuggz.blog.csdn.net/a...

https://www.redux.org.cn/

最初

纯函数这个概念其实并不简单，在没有深刻理解之前咱们工作中也肯定遇到过，也在不经意间用过。只有要正当的去使用它，就是开发中的一把利器。