谈谈JAVASCRIPT中的纯函数

引言

在使用JS中的函数时，也没怎么去区别什么时候该用纯函数，用的很是随意，由于知道一些引用变量是浅拷贝，在函数里改变属性会出错，所以平时在使用函数的时候也注意这些地方。直到接触到react，尤其是redux时候，只能用纯函数去实现，所以趁这次整理一次，避免踩坑

什么是纯函数

• 函数的出口只依赖于函数的形参，和外界变量没有联系
• 函数在执行过程中不产生副作用，即为不改变传入形参的值

这样说起来比较抽象，我们分别举列子来说明

函数的出口只依赖于函数的形参

 var count1=1
  var count2=2
  totalSum=(value)=>{
    return value+count1 //引用了外部变量count1
  }
  console.log(totalSum(count2)) //输出3

此时引用了外部变量count1，违反了规定，则该函数不是纯函数

我们修改一下该例子

  var count1=1
  var count2=2
  totalSum=(value,value1)=>{
    return value+value1 //都是形参
  }
  console.log(totalSum(count2,count1)) //输出3

此时函数中的变量都是来自形参，所以是一个纯函数

函数在执行过程中不产生副作用

 先看一个例子

   var objTest={
     name:'looper'
   }

  function objFunc(obj){
    obj.name='zhuo'

  } 

  objFunc(objTest) //调用函数
  console.log(objTest) //name由 ‘looper’---->‘zhuo’

此时虽然没有外部变量，但是产生了副作用，就是函数在执行过程中改变了形参的值，正好形参是引用类型，所以导致原来的变量也改变了，这也是我们在开发中经常不注意遇到的问题

 

我们可以使用es6的...运算符来解决(在redux中经常用到，保证输出了我们要的结果，又是纯函数)

   var objTest={
     name:'looper'
   }

  function objFunc(obj){
    return {...obj,name:'zhuo'}
  } 

  console.log('产生新的结果', objFunc(objTest)) //'zhuo'
  console.log('原来的变量不会改变',objTest) //'looper'

此时就是存函数

总结

一个函数的返回结果只依赖于它的参数，并且在执行过程里面没有副作用，我们就把这个函数叫做纯函数。

为什么要煞费苦心地构建纯函数？因为纯函数非常“靠谱”，执行一个纯函数你不用担心它会干什么坏事，它不会产生不可预料的行为，也不会对外部产生影响。不管何时何地，你给它什么它就会乖乖地吐出什么。如果你的应用程序大多数函数都是由纯函数组成，那么你的程序测试、调试起来会非常方便。