菜单

函数参数

相关源文件

本文档涵盖了 JavaScript 中处理函数参数和形参的最佳实践。函数参数对代码的可读性、可测试性和可维护性有着显著影响。精心设计的函数签名可以使代码更易于理解,并减少潜在的错误。

有关函数行为和副作用的信息,请参阅 函数行为

概述

函数参数是干净代码的关键方面。精心设计的函数形参通过以下方式帮助创建更具可测试性、可维护性的代码:

  1. 限制认知负荷
  2. 提高可测试性
  3. 增强可读性
  4. 防止副作用

来源: README.md232-286

限制函数参数

限制函数形参的数量对于编写干净、可维护的代码至关重要。推荐的做法是尽可能使用两个或更少的参数。

为什么要限制参数?

  1. 测试复杂性:更多的参数会产生组合爆炸的测试用例
  2. 认知负荷:每个额外的形参都会增加理解函数的脑力负担
  3. 单一职责:许多形参通常表明函数试图做太多事情

推荐

参数数量建议
0-1理想 - 简单易于测试
2可接受 - 仍然相对易于管理
3如果可能,请避免 - 考虑重构
4+强烈不推荐 - 使用对象参数模式

来源: README.md232-243

对象参数模式

当函数需要多个参数时,将它们合并到一个对象参数中。这种模式可以提高可读性,并使函数签名更加灵活。

前后示例

糟糕的方法(多个参数)

好的方法(对象参数)

对象参数的优点

  1. 自文档化的调用(命名属性)
  2. 与顺序无关的参数
  3. 可选参数更容易实现
  4. 更容易在以后添加新参数而不会破坏现有代码

来源: README.md244-286

ES6 解构用于函数参数

ES2015/ES6 的解构语法提供了一种处理函数中对象参数的简洁方式,使代码更具可读性和健壮性。

解构的优点

  1. 清晰性:可以清楚地了解函数使用了哪些属性
  2. 命名参数:实现了命名参数的效果
  3. 原始值保护:克隆原始值,防止副作用
  4. 静态分析:Linter 可以警告未使用属性

来源: README.md249-260

避免布尔标志参数

布尔标志参数(改变函数行为的布尔参数)是函数试图做不止一件事的标志,应该将其拆分成独立的函数。

布尔标志的问题

当函数接受布尔标志时,它通常包含一个 if/else 语句,该语句遵循两条不同的代码路径。这违反了“函数应该只做一件事”的原则。

糟糕的方法(使用标志)

好的方法(单独的函数)

避免布尔标志的好处

  1. 函数具有清晰的单一职责
  2. 代码更具自文档性
  3. 函数名称更好地描述了它们的作用
  4. 更容易独立测试每种行为

来源: README.md565-591

默认参数值

JavaScript 提供了两种主要处理默认参数值的方法:默认参数语法和用于复杂默认值的 `Object.assign`。

简单的默认参数

ES6 提供了简洁的默认参数语法

复杂的默认对象

对于具有多个潜在默认值的复杂对象,请使用 Object.assign

来源: README.md204-228 README.md512-561

函数参数与单一职责原则的关系

函数参数的数量与单一职责原则之间存在很强的关联。参数众多的函数常常因为试图做太多事情而违反这一原则。

测试复杂性增长

随着函数参数数量的增加,所需的测试用例数量呈指数级增长。

参数潜在状态测试复杂性
12 (有效/无效)
24 (2² 组合)中等
38 (2³ 组合)
416 (2⁴ 组合)非常高
532 (2⁵ 组合)极高

来源: README.md232-243 README.md290-322

最佳实践总结

  1. 尽量将函数参数限制为 0-2 个
  2. 需要多个值时使用对象参数
  3. 应用 ES6 解构以提高清晰度和安全性
  4. 避免布尔标志作为参数 - 改为拆分成单独的函数
  5. 使用默认参数值以提高可读性
  6. 考虑单一职责 - 许多参数通常表明函数做的事情太多

请记住,干净的代码是为了让您的意图清晰。设计良好的函数参数可以帮助您和其他开发人员更轻松地理解和维护代码。

来源: README.md232-286 README.md565-591 README.md204-228