扬帆起航:从命令式编程到函数响应式编程

前言:在大学时期,我用Ionic写过一个查看校园信息的app,利用投放广告盈利的方式,我赚到了一台MacBook Pro。在之后的日子里,无论是工作,学习还是生活,它都给我带来极大的便捷。我至今仍心存感激。所以我对Ionic的核心框架Angular充满好感。即使现在的工作中用react居多,但是闲暇时还是会追一追Angular的文档,写一写笔记。
随着工作经验愈发丰富,Angular越来越演变成一种信仰。我在业务编码过程中遇到的诸多问题在Angular中均有优雅的解决方案,这点足令我震撼。所以我决定将它分为不同的章节,依次研读。
我首先选择了Rx,因为它不仅是Angular的核心之一,而且我觉得学习完之后可以应用到现在的工作中,两者兼得。幸运的是,我在西湖边发现了修炼的宝地:平湖秋月。看着荡漾的水波,想象自己是一段流,似乎就化身为Observable,与Rx心灵相通。这极大的提高了我修炼的速度。下面的章节我会将自己学到的知识记录下来,与各位分享。

平湖秋月边修炼Rx

首先,我认为前端开发做好2件事情就够了:1.渲染界面,2.根据用户输入渲染界面。其中渲染界面可以利用React之类的库来完成,它们提供了一种从state映射到view的方式,你只需要管理好state即可,渲染view的工作丢给它们去完成。而根据用户输入渲染界面这部分会比较复杂,其中涉及到异步处理,业务逻辑代码编写等等。项目变得有一定规模之后,会变得比较难以维护。一个很重要的原因在于没有一个直观的组织代码的方式,让维护者一眼看上去就知道这段代码想要表达什么。

接下来,要想解决这个问题,需要好好审视一下web开发的本质。用户点击鼠标,触发了一个事件,你的程序接收到之后开始做一些处理。用户移动鼠标,触发了一个事件,你的程序接收到之后开始做一些处理。只要稍微一想,就会明白web开发其实就是和一系列的事件打交道,只要将这些事件以清晰的方式处理好了,我们的代码自然会变得清晰起来。自然的,我们会想到观察者模式。我们的处理程序都是用户事件的接收者,订阅了用户的事件源,等到有事件源发出通知时,我们的程序就会做出响应。本着顺势而为的哲学思想,我们应该用响应式的思想来编写代码。

然后思考一个问题:我们编写的代码的本质是什么呢?是一系列的处理函数。既然是函数的话,我们可以对计算机说:我想要这样,然后想要那样,最终我想得到的结果是这样。而不是具体的告诉计算机你应该先这样,在那样,最后在这样。前者是函数式的思维,后者是命令式的思维。有点绕,举一个直观的例子吧:最近面试了一个实习生,让他写一个数组去重的代码,他的实现如下:

实习生的数组去重代码

他的思想就是告诉计算机你应该先把这个数组遍历一遍,然后把数组的值当做map的键赋值给map,并初始化为1。然后遍历这个map,取出它的键,push到数组中。返回这个数组。是不是感觉很麻烦。这就是命令式的思维。其实这个实现中有许多bug,比如给定数组arr要是有数字的话,转换后的数组会把数字变成字符串。for in也会遍历原型链上的值。想一想都觉得可怕。要是用函数式的思维呢?

函数式数组去重

是不是清爽许多。这段代码的本质是告诉计算机:我想要把这个数组中除了第一个的相同的数过滤出去。简洁明了,直接告诉计算机你想要什么就好。组合一些现有的函数来进行语义化编程。只要一眼看上去就知道这段代码想要表达什么。在监听到用户的事件时,只需要执行一系列函数,把处理后的结果给负责渲染view的库就OK了。

那为什么函数式编程最近才变得火热起来呢?这是一个历史原因。当时阿兰图灵和冯诺依曼祖师爷创立了计算机这门学科时,因为是开天辟地的创造。所以最早一批学者都有着其他专业背景,但主要分为2大派:电子电气和数学。它们带来了不同的观点。数学家提出的编程语言模型自然具有数学气质,优雅且易于管理,其中Lambda演算就是用纯函数的组合来描述计算过程,如果一个问题能够用一套函数组合的算法来描述,那么就说明这个问题是可计算的。但是当时硬件制造技术很不发达,电子元件制造成本又高,体积又大,无法在一个小芯片上放置多个元件。既然这样,那只好省着点用了,命令式编程就这样兴起了。看过《乔布斯传》的朋友们应该知道,当时乔布斯和沃森为了一款游戏减少几个芯片的使用而耗费精力。

随着硬件技术的进步,这些都不是问题了。所以数学家们提出的优雅的解决方案慢慢的变得流行起来。

最后,我们得到了一个结论。web开发中根据用户输入处理这一步的解决方案即为函数式编程+响应式编程。而这两者结合起来即为函数响应式编程。这正是Rx.js的思想。优雅迷人。接下来让我们一起揭开她美丽的面纱吧n(≧▽≦)n。


后记:如果想认识一群有趣的人,经历一些有趣的事情的话,那么来酷家乐加入我们前端团队吧。简历可以发我邮箱:chonger@qunhemail.com,我来帮你内推。另外秀一波我的无敌景观工位:

无敌景观工位
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,056评论 5 474
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,842评论 2 378
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 148,938评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,296评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,292评论 5 363
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,413评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,824评论 3 393
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,493评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,686评论 1 295
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,502评论 2 318
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,553评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,281评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,820评论 3 305
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,873评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,109评论 1 258
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,699评论 2 348
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,257评论 2 341

推荐阅读更多精彩内容