学习 React 和 Redux 之前需要了解的函数式编程基础知识 - 第一部分

这是一个分为两部分的系列文章，介绍学习 React 和 Redux 之前应该了解的函数式编程基础知识。点击此处阅读第二部分。

React 和 Redux 是现代 JavaScript 生态系统中最流行的两个框架。React 用于构建应用程序的前端，而 Redux 用于管理后端数据。它们结合使用，可以构建快速、可扩展且易于维护的应用程序。

本系列文章将帮助你理解函数式编程，为你学习 React 和 Redux 打下坚实的基础。你将学习JavaScript 中函数式编程的原理和方法，并获得可迁移到其他框架和语言的技能。

本系列的第一篇文章简化了函数式编程的概念，希望读完本文后，学习 React 和 Redux 的门槛会显得小一些。

什么是函数式编程？

就像你可以选择正式或非正式的邮件风格一样，你也可以编写不同风格的代码。目前有几种不同的代码风格（也称为编程范式），包括结构化编程、面向对象编程和函数式编程。

信不信由你，这些模式自艾伦·图灵在电子计算机上写下第一行代码以来，基本上没有改变。此后，数学家阿方索·丘奇在图灵的工作基础上，于1936年提出了λ演算，该演算又为约翰·麦卡锡于1958年开发的LISP语言（第一种函数式编程语言）奠定了基础。

这令人欣慰，因为尽管每天都会涌现出大量的新语言、框架和工具，但函数式编程的概念却一直延续了下来。

你可能已经注意到，资深工程师似乎能轻松掌握新的编程语言。这是因为他们理解了这些核心的、不变的概念，并且能够发现函数式编程的底层模式。

那么，函数式编程究竟有何过人之处？React 团队又为何选择它呢？简单来说，如果你编写一个完全遵循函数式编程原则的应用程序，你的代码将会……

对于像待办事项应用这样的小型个人应用，你可能不会太在意这些好处；但如果你正在为一家价值数百万英镑的公司开发大型应用，那么这些好处就至关重要了。

在介绍这些概念之前，值得注意的是，世上没有完美的应用程序或开发者。软件工程既是一门科学，也是一门艺术。函数式编程无法通过简洁明了的常见问题解答 (FAQ) 提供所有答案。你需要努力理解这些概念，并运用你的最佳判断力来决定如何以及在何处应用它们。

其次，下文中使用了“状态”一词。状态指的是应用程序中所有会发生变化的部分。简单来说，它就是应用程序的数据。例如，在一个在线图书馆应用程序中，状态可以包含书名、作者、用户是否为会员、用户是否在网站上填写了表单等等。了解了这两点之后，我们就可以开始回答函数式编程的概念是什么了。

避免改变状态（也称为避免变更，或不可变性）。这乍听起来很奇怪，因为我们的应用程序中显然需要进行更改……关键在于，你需要复制状态并编辑副本，而不是直接编辑原始状态。例如，如果你有一个团队成员数组，想要添加新成员，你应该复制该数组并编辑复制后的内容，而不是直接编辑现有数组。这也可以理解为“你应该转换你的状态”。
避免使用会改变“外部世界”（也就是避免副作用）的函数。这听起来可能有点奇怪，但它与上述原则类似：你的函数应该只复制和编辑输入，而不是直接修改原始输入。有时副作用是必要的，例如，记录到控制台、向屏幕输出、触发外部进程、写入文件等等，但只要有可能，就不应该“编辑”外部世界，而应该“添加”它。如果确实需要副作用，就应该尽可能地将这些操作与应用程序的其他部分分离和隔离。
应用程序的状态永远不应该被“共享”（即避免共享状态）。要避免状态被“共享”，意味着每次需要“更改”状态时，都应该复制一份并编辑副本，这样状态就不会被真正地“共享”了。

编写可预测的函数，它们只做一件事，并且不会改变周围的“环境”（也就是编写纯函数）。它们没有“副作用”，并且对于相同的输入，它们总是返回相同的输出。
将较小的函数组合成较大的函数，从而构建完整的应用程序（也就是要认真考虑函数组合）。这有助于我们实现文章开头提到的那些理想的应用程序特性。有很多工具可以帮助我们在 JavaScript 中组合函数，这些工具将在本系列的下一篇文章中介绍。
你应该编写能够展现“什么”应该发生，而不是“如何”发生的代码（也就是编写声明式代码）。例如，选择使用 map 函数而不是 for 循环，因为 map 函数是循环的更简洁版本。

从以上内容可以看出，我们试图通过编写纯函数来避免状态变更、副作用和状态共享。我们也注重函数组合，并采用声明式编程。像 Redux 这样的状态管理库为应用程序提供了一个实现这些目标的框架，但在学习它们之前，你应该先了解如何在不使用它们的情况下编写代码。

综上所述，我们可以这样理解这些概念：

本系列函数式编程文章的第二部分将解答如何使用 JavaScript 实现函数式编程概念。

请务必在dev.to或Twitter上关注我，获取更多教程和文章，以帮助您开启软件工程之旅。