定义

简单来说,一个函数的返回结果只依赖于它的参数,并且在执行过程里面没有副作用,我们就把这个函数叫做纯函数。这么说肯定比较抽象,我们把它掰开来看:

  • 函数的返回结果只依赖于它的参数。
  • 函数执行过程里面没有副作用。
const a = 1
const foo = (b) => a + b
foo(2) // => 3

foo 函数不是一个纯函数,因为它返回的结果依赖于外部变量 a,我们在不知道 a 的值的情况下,并不能保证 foo(2) 的返回值是 3。虽然 foo 函数的代码实现并没有变化,传入的参数也没有变化,但它的返回值却是不可预料的,现在 foo(2) 是 3,可能过了一会就是 4 了,因为 a 可能发生了变化变成了 2。

const a = 1
const foo = (x, b) => x + b
foo(1, 2) // => 3

现在 foo 的返回结果只依赖于它的参数 x 和 b,foo(1, 2) 永远是 3。今天是 3,明天也是 3,在服务器跑是 3,在客户端跑也 3,不管你外部发生了什么变化,foo(1, 2) 永远是 3。只要 foo 代码不改变,你传入的参数是确定的,那么 foo(1, 2) 的值永远是可预料的。

这就是纯函数的第一个条件:一个函数的返回结果只依赖于它的参数。

函数执行过程没有副作用
一个函数执行过程对产生了外部可观察的变化那么就说这个函数是有副作用的。

我们修改一下 foo:

const a = 1
const foo = (obj, b) => {return obj.x + b
}
const counter = { x: 1 }
foo(counter, 2) // => 3
counter.x // => 1

我们把原来的 x 换成了 obj,我现在可以往里面传一个对象进行计算,计算的过程里面并不会对传入的对象进行修改,计算前后的 counter 不会发生任何变化,计算前是 1,计算后也是 1,它现在是纯的。但是我再稍微修改一下它:

const a = 1
const foo = (obj, b) => {obj.x = 2return obj.x + b
}
const counter = { x: 1 }
foo(counter, 2) // => 4
counter.x // => 2

现在情况发生了变化,我在 foo 内部加了一句 obj.x = 2,计算前 counter.x 是 1,但是计算以后 counter.x 是 2。foo 函数的执行对外部的 counter 产生了影响,它产生了副作用,因为它修改了外部传进来的对象,现在它是不纯的。

但是你在函数内部构建的变量,然后进行数据的修改不是副作用:

const foo = (b) => {const obj = { x: 1 }obj.x = 2return obj.x + b
}

虽然 foo 函数内部修改了 obj,但是 obj 是内部变量,外部程序根本观察不到,修改 obj 并不会产生外部可观察的变化,这个函数是没有副作用的,因此它是一个纯函数。

除了修改外部的变量,一个函数在执行过程中还有很多方式产生外部可观察的变化,比如说调用 DOM API 修改页面,或者你发送了 Ajax 请求,还有调用 window.reload 刷新浏览器,甚至是 console.log 往控制台打印数据也是副作用。

纯函数很严格,也就是说你几乎除了计算数据以外什么都不能干,计算的时候还不能依赖除了函数参数以外的数据。

总结

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

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


作者:胡子大哈
原文链接: http://huziketang.com/books/react/lesson32

JavaScript----什么是纯函数相关推荐

  1. 在javascript中使用纯函数处理副作用

    在javascript中使用纯函数处理副作用 今天给大家带来一片译文, 详情请点击这里.可能在墙内哦 开始了, 如果你点开这篇文章, 就证明你已经开始涉及函数式编程了, 这距离你知道纯函数的概念不会很 ...

  2. JavaScript中的纯函数是什么?

    Pure functions are the atomic building blocks in functional programming. They are adored for their s ...

  3. javascript 中的纯函数

    纯函数 引言 对于函数,大家都不陌生,但是对于纯函数可能有些生疏.我们在写函数的时候,会肆无忌惮,充分的利用js的一些特性,比如使用作用域去修改外部变量,对象属性,数据结构等.这样写如果稍不注意,可能 ...

  4. JavaScript函数式编程之深入理解纯函数

    更多相关内容见博客 https://github.com/zhuanyongxigua/blog 纯函数是函数式编程的基础,需要重点理解. 纯函数的概念: 纯函数是这样一种函数,即相同的输入,永远会得 ...

  5. JavaScript函数式编程(纯函数、柯里化以及组合函数)

    JavaScript函数式编程(纯函数.柯里化以及组合函数) 目录 JavaScript函数式编程(纯函数.柯里化以及组合函数) 前言 1.纯函数 1.1.纯函数的概念 1.2.副作用 1.3.纯函数 ...

  6. javascript的纯函数

    javascript纯函数 javascript纯函数 1.什么是纯函数? 2.例子 : 1.什么是纯函数? 一个函数的返回结果只依赖于它的参数,并且在执行过程里面没有副作用,我们就把这个函数叫做纯函 ...

  7. JavaScript 数组纯函数

    1. 常用的数组 API forEach 遍历所有元素,item 对应的是元素的值,index 对应的是元素的位置 let arr = [4, 6, 8]; arr.forEach(function( ...

  8. 【Javascript】纯函数

    纯函数是一类特别的函数: 只要是同样的输入(实参),必定得到同样的输出(返回) 纯函数的特点: 它没有改变原来参数的值 它没有修改外部的变量和数据 每次调用时传递相同的值,返回的结果永远一样 必须遵守 ...

  9. react中纯函数_如何在纯React中创建电子邮件芯片

    react中纯函数 by Andreas Remdt 由Andreas Remdt 如何在纯React中创建电子邮件芯片 (How to create email chips in pure Reac ...

  10. java 函数式编程 示例_功能Java示例 第8部分–更多纯函数

    java 函数式编程 示例 这是第8部分,该系列的最后一部分称为"示例功能Java". 我在本系列的每个部分中开发的示例是某种"提要处理程序",用于处理文档. ...

最新文章

  1. php数字截取2位小树,数据结构-PHP 二分搜索树的层序遍历(队列实现)
  2. linux命令:find文件查找工具
  3. 第一章--第一节:环境搭建
  4. python从ip端口 获取数据_python 如何获得Ip地址和端口啊?
  5. 转:V.I. Arnold 论数学教育
  6. linux postfix 搭建,linux 下搭建postfix服务器
  7. django-模型类的修改-外键
  8. 随机获取部分ListObject集合
  9. 如何找一个程序员做男朋友?
  10. gMIS吉密斯导航菜单Navimenu、自动安装等更新
  11. 少量代码完成火山图绘制
  12. 机械制图计算机识图,机械制图与识图基础.ppt
  13. 扩展以太网——集线器
  14. Maximum upload size exceeded
  15. FPGA三分频电路的实现
  16. ctfshow web入门-sql注入
  17. 墙裂推荐!Pycharm里6大神器插件!
  18. 修改MySQL 数据库 密码
  19. 利用计算机绘制地质图的思路和方法,基于规则的地质快速辅助成图
  20. 关于PyCharm中python模块无法安装的问题

热门文章

  1. 学习一下360浏览器的插件开发
  2. 异步和同步 并发和并行
  3. 人若不修行,女人嫁谁都遗憾,男人娶谁都后悔
  4. 银河麒麟操作系统获知系统安装时间
  5. html表项点击跳转,html table 点击跳转
  6. 【工程实践】飞马SLAM100三维数据处理
  7. 拜耳与阿里健康将在多个领域开展深度合作
  8. 学习各种目标检测的FPN(多层次特征融合)
  9. java 集成logback_java web工程中logback换配置文件的路径
  10. Spark-sql arraystruct中 struct字段截取(spark2.4版本以上)