◼ 函数式编程中有一个非常重要的概念叫纯函数,JavaScript符合函数式编程的范式,所以也有纯函数的概念;
◼ 纯函数的维基百科定义:
在程序设计中,若一个函数符合以下条件,那么这个函数被称为纯函数:
此函数在相同的输入值时,需产生相同的输出。
函数的输出和输入值以外的其他隐藏信息或状态无关,也和由I/O设备产生的外部输出无关。
该函数不能有语义上可观察的函数副作用,诸如“触发事件”,使输出设备输出,或更改输出值以外物件的内容等。
◼ 当然上面的定义会过于的晦涩,所以我简单总结一下:
确定的输入,一定会产生确定的输出;
函数在执行过程中,不能产生副作用
副作用概念的理解
◼ 在计算机科学中,也引用了副作用的概念,表示在执行一个函数时,除了返回函数值之外,还对调用函数产生了附加的影响,
比如修改了全局变量,修改参数或者改变外部的存储;
◼ 纯函数在执行的过程中就是不能产生这样的副作用:
副作用往往是产生bug的“温床”。
纯函数的案例
◼ 我们来看一个对数组操作的两个函数:
slice:slice截取数组时不会对原数组进行任何操作,而是生成一个新的数组;
splice:splice截取数组, 会返回一个新的数组, 也会对原数组进行修改;
◼ slice就是一个纯函数,不会修改数组本身,而splice函数不是一个纯函数;
案例:
var names = ["abc","cba","nba","bba"]
// 1.slice --->是一个纯函数不会修改原数组
var newNames = name.slice(0,2) //==>var newNames = [].slice.call(names,0,2)
console.log(names)
// 2. splice--->不是纯函数会修改原数组
names.splice(0,2)
console.log(names)
纯函数的作用和优势
◼ 为什么纯函数在函数式编程中非常重要呢?
因为你可以安心的编写和安心的使用;
你在写的时候保证了函数的纯度,只是单纯实现自己的业务逻辑即可,不需要关心传入的内容是如何获得的或者依赖其他的外部变量是否已经发生了修改;
你在用的时候,你确定你的输入内容不会被任意篡改,并且自己确定的输入,一定会有确定的输出;
◼ React中就要求我们无论是函数还是class声明一个组件,这个组件都必须像纯函数一样,保护它们的props不被修改: