JavaScript函数式编程中纯函数的理解(代码)


本文摘自PHP中文网,作者不言,侵删。

本篇文章给大家带来的内容是关于JavaScript函数式编程中纯函数的理解(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

函数式编程中纯函数如何理解?

概念: 不依赖执行的上下文,也不影响上下文的变量,输出只由输入决定

代码理解一下

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

// 综上,非纯函数,输入依赖外部变量

let b = 1

function unPure(a) {

    return a + b

}

 

// 综上,非纯函数,输出改变外部变量

let o = {}

function unPure(object) {

    object.ex = 1

    return object

}

 

// 综上, 纯函数, 输出输入不影响外部变量

function pure(a) {

    let b = 1

    return a + b

}

纯函数的好处

相信大家发现了,无论是概念还是代码理解都很简单, 那为什么要使用纯函数呢? 下面我们罗列一下使用纯函数的好处

  • 可缓存性
  • 可移植性
  • 可测试性
可缓存性

纯函数可以根据输入来做缓存

1

2

3

4

5

6

7

8

9

10

// 下面的代码我们可以发现相同的输入,再第二次调用的时候都是直接取的缓存

let squareNumber  = memoize((x) => { return x*x; });

squareNumber(4);

//=> 16

squareNumber(4); // 从缓存中读取输入值为 4 的结果

//=> 16

squareNumber(5);

//=> 25

squareNumber(5); // 从缓存中读取输入值为 5 的结果

//=> 25

怎么实现呢? 我们接着看下面的代码

1

2

3

4

5

6

7

8

9

const memoize = (f) => {

  const cache = {};

  return () => {

    var arg_str = JSON.stringify(arguments);

    // 关键就在这里,我们利用纯函数相同输入相同输出的逻辑,在这里利用cache做一个简单的缓存,当这个参数之前使用过时,我们立即返回结果就行

    cache[arg_str] = cache[arg_str] || f.apply(f, arguments);

    return cache[arg_str];

  };

};

可移植性

可移植性大白话过来就是,在任何一个地方都可以随意使用,A项目中使用过的,B项目想要使用直接拿过来就ok的那种

代码再来理解一下

1

2

3

4

5

6

7

8

9

10

11

12

13

14

// 我们注意看下方有两个注册的函数

 

// 不纯的, 如果B项目想要用到这个函数,很显然我们将其依赖的其它服务给搬过去

const signUp = function(attrs) {

  var user = saveUser(attrs);

  welcomeUser(user);

}

// 纯的, 我们再来看看下面这个纯函数写法,纯函数给了我们足够多的信息,我们想在B项目使用其功能只需将单个方法搬过去再给其注入需要的参数即可

const signUp = function(Db, Email, attrs) {

  return function() {

    var user = saveUser(Db, attrs);

    welcomeUser(Email, user);

  };

};

可测试性

综上所述,这个就很简单了,我们不需要关心其它外部的信息,只需要给函数特定的输入,再断言其输出就好了

总结

  • 输出不依赖外部变量
  • 输出不改变外部变量
  • 固定输入固定输出
  • 可缓存,可移植,可测试

以上就是JavaScript函数式编程中纯函数的理解(代码)的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

你不太了解的json

javascript字符串怎么替换所有字符

怎么将javascript对象转换为json字符串

javascript中字符串(string)如何转json

javascript中使用for...in 和object.keys()枚举对象属性的差异(附代码)

十款面向前端开发人员的chrome扩展(分享)

javascript var是什么

javascript如何实现删除提示信息

使用html5的canvas和javascript创建一个绘图程序的示例代码

javascript怎么隐藏元素值

更多相关阅读请进入《javascript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...