js的纯函数(Pure Function)

纯函数的优势

1.安心的编写和安心的使用
2.写的时候只要关心传入的内容,不关心依赖其他的外部变量
3.用的时候只要确定的输入,一定会有确定的输出
4.React组件使用纯函数,来保护props不被修改

是不是纯函数的对比

var names = ['aaa', 'bbb', 'ccc', 'ddd']
// 1. slice()定义：从已有的数组中返回你选择的某段数组元素 
var newArr1 = names.slice(0, 3) // 左开右闭取值
console.log(newArr1);
console.log(names);
// 结论: 传入start/end值,返回确定的值,不会修改原来的数组. slice()就是一个纯函数

// 2. splice()定义：从数组中添加或删除或获取元素 然后返回被修改之后的数组元素
var newArr2 = names.splice(2)
console.log(newArr2);
console.log(names);
// 结论: splice()执行时修改原来的数组 修改的操作就是产生的副作用 splice()不是一个纯函数

纯函数的判断

// 证明函数是不是一个纯函数?
// 1.相同的输入一定产生相同的输出
// 2.执行过程中不会产生任何的副作用
function foo(num1, num2) {
  return num1 * 2 + num2
}


// bar()不是纯函数, 修改了变量值,产生副作用,后面使用时其值改变
var age = 18
function bar() {
  // 其他代码执行
  age = 3
}
bar()
console.log(age);

// 如果你编写一个纯函数,可以在返回新对象中进行修改
// test是一个纯函数
function test(info){
  return{
    ...info,
    age: 2
  }
}
var obj = { name: 'Fhup',age: 18 }

test(obj)
test(obj)
test(obj)