0

0

javascript为什么用函数式编程

青灯夜游

青灯夜游

发布时间:2022-09-30 15:10:14

|

1769人浏览过

|

来源于php中文网

原创

原因:1、js的语法是从Scheme这种函数式编程语言借鉴而来。2、就浏览器端而言,随着各种单页框架的发展,客户端的处理能力不断提升,越来越多的业务逻辑被放到端,从而导致客户端要维护的状态越来越多;随之而来的问题是,一不小心就会大量使用依赖于外部变量的函数,这些函数随着业务逻辑不断增加,从而导致逻辑分支剧增,状态难以追踪,代码可读性差,难以维护,而函数式编程有着很好的解决方案。

javascript为什么用函数式编程

本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

一、什么是函数式编程?

函数式编程(Functional programming),简称 FP,并不是什么库或者框架,与过程式编程(Procedural programming)相对,而是一种编程范式。FP 通过声明纯函数抽象数据的处理,来避免或尽可能减少函数调用对于外部状态和系统产生的副作用。

所谓副作用,大抵有改变函数外系统状态,向外抛出异常,处理用户操作,修改入参,数据库查操作,DOM操作等等可能会引起系统错误操作。

立即学习Java免费学习笔记(深入)”;

二、为什么在 JavaScript 使用函数式编程思想

2.1 从语言特性来看

JavaScript 一开始的语法就是从 Scheme 这种函数式编程语言借鉴而来。随着语言标准的推进,语言本身的功能性不断丰富,闭包、箭头函数、高阶函数,数组迭代等等功能都让 JavaScript 中实现 FP 变得简单,简单讲几个特性:

2.1.1. lambda 表达式

lambda 表达式其实是一个匿名函数,使用箭头清晰的表示输入输出的映射关系,JavaScript 中使用箭头函数来实现。

const multiply = x => x * x
multiply(6) // 36

2.1.2 高阶函数

高阶( Higher-order )函数可以接受一个或者多个函数作为入参,输出一个函数。

简单写两个例子

const add = x => y => x + y
const add10 = add(10)
add10(5) // 15
const compose = (...fns) => x =>  fns.reduce((acc, fn) => fn(acc), x)
const a = x => x + 1
const b = x => x + 2
const composedFn = compose(a, b)
composedFn(1) // 1 + 1 + 2 = 4

2.1.3 filter map forEach reduce 迭代

Array.prototype 下的 filter map forEach reduce 都是高阶函数,因为入参是个函数。

const flatten = (arr = []) => arr.reduce(
  (acc, val)=> accconcat(Array.isArray(val) ? flatten(val) : val),
  []
)
let arr = [1,[ 4, 5 ], 2, 3];
flatten(arr)  // [1, 4, 5, 2, 3]

2.2 从实际需求角度来看

就浏览器端而言,随着各种单页框架的发展,客户端的处理能力不断提升,越来越多的业务逻辑被放到端,从而导致客户端要维护的状态越来越多。随之而来的问题是,我们一不小心就会大量使用依赖于外部变量的函数,这些函数随着业务逻辑不断增加,从而导致逻辑分支剧增,状态难以追踪,代码可读性差,难以维护,而 FP 恰恰有着很好的解决方案。

另外,现在主流的编程语言基本上都引入函数式编程的特性,即使是以面向对象著称的 java,通过使用 stream + lambda 表达式,依然可以实践函数式编程思想,而 Spring5 更是将 Reactive 作为主要卖点,总之 FP 近来很火。

而 JS 的函数式编程生态也在不断丰富, RxJS, circleJS 等框架在前端产线上的应用也越来越广。

三、使用函数式的优点

使用 FP 编程主要有以下几个优点:

  • 将数据和处理逻辑分离,代码更加简洁,模块化,可读性好

  • 容易测试,测试环境容易模拟

  • 逻辑代码可复用性强

四、函数式编程相关概念

AI Web Designer
AI Web Designer

AI网页设计师,快速生成个性化的网站设计

下载

函数式编程的实现主要依赖于:

  • 声明式编程

  • 纯函数

  • 不可变数据

4.1 声明式编程

声明式编程 Declarative programming 只描述目标的性质,从而抽象出形式逻辑,告诉计算机需要计算什么而不是如何一步步计算。例如正则、SQL、 FP 等。

指令式编程 Imperative Programming 告诉计算机每一步的计算操作

最简单的,相同的数组处理,使用 for 循环是指令式,用 map 之类的操作是声明式。使用声明式编程,简化了代码,提高了复用率,为重构留有余地。

4.2 纯函数

纯函数简要概括有两个特点:

  • 函数的输出只与输入有关,相同输入产生的输出一致,并不会不依赖外部条件

  • 函数调用不会改变函数域以外的状态或者变量,不会对系统产生副作用

看个简单的例子:

let counter = 0
const increment = () => ++counter
const increment = counter => ++counter

前一个函数每次调用都会修改外部变量的值,返回值也依赖于外部变量;后一个函数对于同一输入值每次返回的结果都相同,并且不会对外部状态造成影响。所以后一个是纯函数。

为什么要追求函数的纯度,这就涉及到一个称为引用透明性的概念。

4.2.1 引用透明性

纯函数的这种函数的返回值只依赖于其输入值的特性,被称为引用透明性(referential transparency),纯函数都是可以进行缓存的。

const memorize(pureFn) {
  const _cache = {}
  return (...args) => {
    const key = JSON.stringify(args)
    return _cache[key] || (_cache[key] = purFu.apply(null, args))
  }
}

4.3 Immutable Data

「可变的全局状态是万恶之源」(其实从功能代码的角度看,局部和全局是相对而言的),简而言之可变状态会让程序的运行变得不可预测,代码可读性差,难以维护。

在 JS 中,当函数入参是对象类型的数据时,我们拿到的其实是个引用,所以即使在函数内部我们也是可以修改对象内部的属性,这种情景依然会产生副作用。

所以这个时候就需要引入 Immutable 的概念。 Immutable 即 unchangeable, Immutable data在初始化创建后就不能被修改了,每次对于 Immutable data 的操作都会返回一个新的 Immutable data。 所以并不会对原来的状态形成改变(当然不是简单的深拷贝再修改)。

Immutable 比较流行的 JS 实现有 immutable-js 和 seamless-immutable; 对于 React 党来说, immutable-js 一点都不陌生, immutable-js 配合 Redux 就是一种很好的 FP 实践。

const map1 = Immutable.Map({a:1, b: {d:2}, c:3});
const map2 = map1.set('a', 50);
map1 === map2 // false
const mapb1 = map1.get('b')
const mapb2 = map2.get('b')
mapb1===mapb2 // true

【相关推荐:javascript视频教程编程视频

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

WorkBuddy
WorkBuddy

腾讯云推出的AI原生桌面智能体工作台

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
数据分析工具有哪些
数据分析工具有哪些

数据分析工具有Excel、SQL、Python、R、Tableau、Power BI、SAS、SPSS和MATLAB等。详细介绍:1、Excel,具有强大的计算和数据处理功能;2、SQL,可以进行数据查询、过滤、排序、聚合等操作;3、Python,拥有丰富的数据分析库;4、R,拥有丰富的统计分析库和图形库;5、Tableau,提供了直观易用的用户界面等等。

1134

2023.10.12

SQL中distinct的用法
SQL中distinct的用法

SQL中distinct的语法是“SELECT DISTINCT column1, column2,...,FROM table_name;”。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

340

2023.10.27

SQL中months_between使用方法
SQL中months_between使用方法

在SQL中,MONTHS_BETWEEN 是一个常见的函数,用于计算两个日期之间的月份差。想了解更多SQL的相关内容,可以阅读本专题下面的文章。

381

2024.02.23

SQL出现5120错误解决方法
SQL出现5120错误解决方法

SQL Server错误5120是由于没有足够的权限来访问或操作指定的数据库或文件引起的。想了解更多sql错误的相关内容,可以阅读本专题下面的文章。

2194

2024.03.06

sql procedure语法错误解决方法
sql procedure语法错误解决方法

sql procedure语法错误解决办法:1、仔细检查错误消息;2、检查语法规则;3、检查括号和引号;4、检查变量和参数;5、检查关键字和函数;6、逐步调试;7、参考文档和示例。想了解更多语法错误的相关内容,可以阅读本专题下面的文章。

380

2024.03.06

oracle数据库运行sql方法
oracle数据库运行sql方法

运行sql步骤包括:打开sql plus工具并连接到数据库。在提示符下输入sql语句。按enter键运行该语句。查看结果,错误消息或退出sql plus。想了解更多oracle数据库的相关内容,可以阅读本专题下面的文章。

1703

2024.04.07

sql中where的含义
sql中where的含义

sql中where子句用于从表中过滤数据,它基于指定条件选择特定的行。想了解更多where的相关内容,可以阅读本专题下面的文章。

586

2024.04.29

sql中删除表的语句是什么
sql中删除表的语句是什么

sql中用于删除表的语句是drop table。语法为drop table table_name;该语句将永久删除指定表的表和数据。想了解更多sql的相关内容,可以阅读本专题下面的文章。

440

2024.04.29

TypeScript类型系统进阶与大型前端项目实践
TypeScript类型系统进阶与大型前端项目实践

本专题围绕 TypeScript 在大型前端项目中的应用展开,深入讲解类型系统设计与工程化开发方法。内容包括泛型与高级类型、类型推断机制、声明文件编写、模块化结构设计以及代码规范管理。通过真实项目案例分析,帮助开发者构建类型安全、结构清晰、易维护的前端工程体系,提高团队协作效率与代码质量。

26

2026.03.13

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 6万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 3.4万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.6万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号