首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >帮你精通JS: 学习函数式编程

帮你精通JS: 学习函数式编程

作者头像
前端逗逗飞
发布2021-04-30 10:33:11
7390
发布2021-04-30 10:33:11
举报
文章被收录于专栏:前端逗逗飞前端逗逗飞

一、什么是函数式编程

从FP函数式编程的眼中看来,世界的万事万物就是处理数据流:

input --> process -- output

a00f3b086bf647b6b229d0ca5d668998.jpeg
a00f3b086bf647b6b229d0ca5d668998.jpeg

比如非函数式,会这样写程序:

var name = "gaowei"; 
var greeting = "Hello,I'm ";;
console.log(greeting + name)
Hello,I'm gaowei

而函数范式编程则会这样写程序:

 function greet(name) {
... return "Hi, I'm " + name;
... }
greet("Gaowei");
"Hi, I'm Gaowei"
复制代码

二、 用纯函数 pure-function,避免 副作用 side-effects

举例说明“非纯函数”:

let name = "Gaowei";
function greet() {
... console.log("Hi, I'm " + name);
... }
greet()
Hi, I'm gaowei
复制代码

这就不是一个纯函数,因为没有返回结果。 而纯函数则是:

function greet(name) {
... return "Hi, I'm " + name;
... }
复制代码

三、使用高阶函数 higher-order-function,函数本身可作为输入或者输出

在高阶函数中,函数本身又可作为输入与输出。

 function setAdjectifier(adjective) {
... return function(description) {
..... return adjective + " " + description;
..... }
... }
let greatifier = setAdjectifier("great");
greatifier("meeting")
'great meeting'
复制代码

四、不要迭代,用 map, reduce 和 filter

map与filter之间的关联与区别,可以参见下面这张图:

21a5ac373b8644319ad729ca11eaad9a.jpeg
21a5ac373b8644319ad729ca11eaad9a.jpeg

五、不要更改输入数据,用不可变更的数据结构

举例,我们惯常的做法常常为:

 let fruits = ['apple', 'banana', 'peach'];
 fruits[2] = 'orange'
'orange'
 fruits
[ 'apple', 'banana', 'orange' ]

上面的mutation的处理方法,将会修改原始数据。 尝试 functional-programming的方式为:

> newFruits = fruits.map( rm => rm == "orange" ? "peach" : rm)
[ 'apple', 'banana', 'peach' ]
> fruits
[ 'apple', 'banana', 'orange' ]
复制代码

而能够高效处理 immutable 数据的常用库为:Mori, immutable.js, Underscor, Lodash, Ramda 等

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、什么是函数式编程
  • 二、 用纯函数 pure-function,避免 副作用 side-effects
  • 三、使用高阶函数 higher-order-function,函数本身可作为输入或者输出
  • 四、不要迭代,用 map, reduce 和 filter
  • 五、不要更改输入数据,用不可变更的数据结构
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档