函数式JavaScript_不可变数据与纯函数-js教程-PHP中文网

函数式JavaScript_不可变数据与纯函数

紅蓮之龍

发布： 2025-11-18 20:34:53

原创

688人浏览过

纯函数指输入相同则输出相同且无副作用的函数，如add(a,b)；不可变数据要求不修改原数据而是生成新数据，避免副作用；结合二者可提升代码可预测性和可维护性，尤其在React等框架中优势明显。

函数式javascript_不可变数据与纯函数

在现代JavaScript开发中，函数式编程的思想越来越受到重视。它帮助我们写出更清晰、更可预测、更容易测试的代码。其中两个核心概念是不可变数据和纯函数。理解并实践它们，能显著提升代码质量。

什么是纯函数？

纯函数是指：只要输入相同，输出就一定相同，并且不会产生任何副作用的函数。

关键特征包括：

相同的输入永远返回相同的输出
不修改外部状态（如全局变量）
不依赖或改变传入的参数
没有副作用，比如网络请求、DOM操作、console.log等

例如：

function add(a, b) {
  return a + b;
}

登录后复制

这个add函数就是纯函数——它只依赖输入，只返回结果，不做其他事。

立即学习“Java免费学习笔记（深入）”；

为什么使用不可变数据？

不可变数据意味着一旦创建，就不能被更改。如果需要“修改”，实际上是生成一个新的对象或数组。

JavaScript中的原始类型（如字符串、数字）天生不可变，但对象和数组是可变的，容易引发问题。

动态WEB网站中的PHP和MySQL：直观的QuickPro指南第2版

动态WEB网站中的PHP和MySQL详细反映实际程序的需求，仔细地探讨外部数据的验证(例如信用卡卡号的格式)、用户登录以及如何使用模板建立网页的标准外观。动态WEB网站中的PHP和MySQL的内容不仅仅是这些。书中还提到如何串联JavaScript与PHP让用户操作时更快、更方便。还有正确处理用户输入错误的方法，让网站看起来更专业。另外还引入大量来自PEAR外挂函数库的强大功能，对常用的、强大的包

508

查看详情

例如，直接修改数组会带来副作用：

const list = [1, 2, 3];
list.push(4); // 原数组被改变了

登录后复制

这违反了函数式原则。应使用不改变原数据的方法：

const newList = [...list, 4]; // 创建新数组

登录后复制

这样原数组保持不变，行为更可预测。

结合纯函数与不可变数据的实践

当纯函数处理不可变数据时，代码变得更可靠。比如处理用户列表：

const users = [{ id: 1, active: true }, { id: 2, active: false }];

// 纯函数：返回新数组，不修改原数据
function deactivateUser(users, userId) {
  return users.map(user =>
    user.id === userId ? { ...user, active: false } : user
  );
}

const updated = deactivateUser(users, 2);

登录后复制

这里map和对象扩展语法保证了原users未被修改，函数输出仅由输入决定。

基本上就这些。坚持使用纯函数和不可变数据，会让调试更容易，状态管理更清晰，特别是在React或Redux这类框架中效果明显。不复杂但容易忽略。

以上就是函数式JavaScript_不可变数据与纯函数的详细内容，更多请关注php中文网其它相关文章！