一个小故事引起的讨论:JavaScript中使用函数式编程

前言

昨天的文章中提到了一个小插曲, 故事的由来是我微信中的一个"小老板"突然来了个不可言喻的表情(Little (small) boss "SB..."??? 哈哈 还是简称小吧)。然后开始了下面的对话:

• 小: 最近TM的好烦
• 我: 怎么了 boss
• 小: 我写的代码最近新增了业务 改动起来 牵一发而动全身。心态有点小炸裂。
• 我: 具体怎么个情况?让小老弟帮你排排忧。
• 小: 之前不是刚独立负责项目吗，从0到1实现起来感觉也没啥太大的困难。但是呢 最近在原来的基础上新增了点新业务需求需要改动之前的代码。就总遇到一些问题 一个函数内的全局变量改动然后功能很多都失效了 导致需要一直debug追踪到底在哪里使用了。。。
• 我: 我一般拿到项目/产品需求之后在写代码前会花大量事件思考设计 可能比例7:3甚至8:2;经验是一方面。思考还是很重要的。回到你的问题 就说你前期没做好一些工作例如:编码设计;整体模块划分;工程类框架(做一些单元测试,覆盖率测试..)等等措施,今天给你聊一下具体如何解决这些小问题!!

我展开了一系列装逼和舔的操作....

回到今天文章的主题介绍一下编程范式,以及如何在JavaScript中使用起来。

什么是编程范式 ?

编程范式(Programming paradigm)是指计算机中编程的典范模式或方法。

编程范式主要包含：命令式编程(Imperative)、声明式编程(Declarative)和函数式编程(Functional)...

命令式编程：

命令式编程的主要思想是关注计算机执行的步骤，即一步一步告诉计算机先做什么再做什么。

比如：如果你想进行一个变量与变量组合的输出，你需要这样告诉计算机：

1. 第一步: 创建一个变量(名字) name;
2. 第二步: 创建一个变量(问候语) greeting;
3. 第三步: console.log输出

   var name = "wlove"; //声明
   var greeting = "hello, I'm ";//声明
   console.log(greeting + name);//输出 hello, I'm wolove

声明式编程：

声明式编程是以数据结构的形式来表达程序执行的逻辑。它的主要思想是告诉计算机应该做什么，但不指定具体要怎么做。日程最接近的就说网页编程中用到的 HTML 和 CSS 都属于声明式编程。(解释一下:HTML/CSS它们的编写其实就是结构化的 不会具体告诉计算机做什么细节内容。所以属于声明式编程Declarative programming;其实和很多配置文件很相似。)

最直接举例就是SQL：

SELECT * FROM table WHERE num < 5

通过观察声明式编程的代码我们可以发现它有一个特点是它不需要创建变量用来存储数据。
另一个特点是它不包含循环控制的代码如 for， while。

函数式编程：

函数式编程和声明式编程是有所关联的，因为他们思想是一致的：即只关注做什么而不是怎么做。但函数式编程不仅仅局限于声明式编程。

函数式编程最重要的特点是”函数第一位"，即函数可以出现在任何地方，比如你可以把函数作为参数传递给另一个函数，不仅如此你还可以将函数作为返回值。很重要一点;如果你使用得当这种编程只需要考虑输入输出的一个流。什么对象(原型)以及其的副作用(相互作用影响)都不需要考虑。

说起函数式编程 可能接触别的语言的朋友 一下就会回忆起 Haskell,Clojure这些语言。其实大部分常见的编程语言都已经提供了对这种编程方式的支持;比如今天的主角JavaScript。

相比于以前的命令式编程;声明式编程,我更偏向于使用函数式编程。首先我实验过面向对象(原型)的方式来进行编程。很困惑或者说很痛苦;每一次的debug相当的提神醒脑;其次函数式编程可以让代码的逻辑更清晰更优雅;更安全。(总之个人用起来就说很爽)

JavaScript的函数式编程几个介绍:

说起函数式编程最基本需要考虑side effect(无副作用)和pure(纯);如果按这样去实现就能合理的解决小老板的一个很重要的问题 debug一个变量一直跟踪哪里修改了...;

//例子1 纯函数
function greet(name){
    return "hello I'm " + name;
}
greet("wlove") // hello I'm wlove


//例子2 非纯函数  用到了外部的变量
var name = "wlove"
function _fn(name){
    return pre + str
}
greet(name)// hello I'm wlove 

函数式编程还有一个特点高阶函数(也是提升的一个重要知识点);函数可以作为一个函数的返回。

//高阶函数:
function greet(greeting){
    return function(name){
        return greeting + " " + name
    };
}
var GREETING = greet("hello I' m");
GREETING("wlove"); // "hello I' m  wlove"

函数式编程还有一个需要思考的问题;如果说每次都重新生成一个Copy对象(举个例子 如果输入的参数是array);每次改变重新生成一个。那样会增加空间的使用。如何解决这个问题? 大家可以思考一下或者查阅一些资料。留言讨论一下。

最后

距离上一篇文章的生活日记: 20210524 日常生活的重复。开会;学习;写代码;跑步;写文章;录视频;逛社区...开心就完事了。

本篇文章主要是因为我特别想帮助(tian)小老板 哈哈;也算是随想随写;欢迎大家留言讨论。后面评论会补充介绍如何有效解决空间问题。

聊完天之后我的小老板就是一顿夸,但是也不知道实践没实践。我得多主动跟人家聊聊天 嘿嘿

下一篇JS引擎,作为前端到底需要认识到什么地步,以及如何学习。