js 命名约定

计算机科学中只有两件难事：缓存失效和命名。

菲尔·卡尔顿

撇开缓存失效不谈，这确实很棘手，每次我找不到正确的名称时，那个臭名昭著的参考资料都会在我的脑海中浮现。

当有人需要快速理解代码时，无论是编码、调试还是帮助队友，清晰的命名提供了重要的上下文 - 我不需要问别人用户的意思，我需要问数据意味着什么。

虽然我不经常想出最好的名字，但我尝试通过遵循一些基本规则来优化我的代码。

使用有意义的前缀

虽然不通用，但这些前缀非常适合在团队中创建通用语言。在整个代码库中一致地使用它们可以使代码更易于阅读和理解。

• 函数名前缀 get、search 和retrieve 用于指示函数返回一个值。
• 函数名前缀 set 和 update 用于表示该函数用于在
• 内进行更新，handle 用于事件处理函数
• is、should、can 表示一个值或函数，是布尔类型

任何成为团队标准的约定都有助于提高可读性。请务必将它们记录在项目的自述文件或 wiki 中。

使用有意义的词语

例如，开发人员通常会为变量数据赋予默认名称，但让我们回顾一些定义：

• 作为推理、讨论或计算基础的事实信息（例如测量或统计）
• 可以传输或处理的数字形式的信息

这些定义可以引用我们正在处理的任何变量，因此它们不会向读者传达任何信息。让我们看一个不遵循此规则的示例：

function total(data) {
  let total = 0;
  for (let i = 0; i < data.length; i++) {
    total += data[i].value;
  }

  return total;
}

我们知道这个函数计算一些东西，但我们不确定计算什么。

使用完整的单词

命名变量时，键盘快捷键通常表示缩写或单位数字变量名称。

和上面的案例代码一样，我们来看一个不符合规则的函数：

function totBal(accts) {
  let tot = 0;
  for (let i = 0; i < accts.length; i++) {
    tot += accts[i].bal;
  }

  return tot;
}

我们可能会认为accts是账户，tot是总计，但是我们一眼看不出代码的含义。

不要使用“无用”的词语

容器和包装纸仅与其内容相关才有意义。问题是每个不是父组件的组件都包含另一个组件。

如果您将组件命名为 MyComponentContainerContainer，您也会处于尴尬的境地。案件也是如此。

请注意拼写：)

拼写错误的单词会导致错误，并使查找代码变得更加困难。拼写错误很容易被忽视，但如果代码库中的所有内容都拼写正确，那么它可能会产生很大的影响，特别是当您尝试全局查找/替换时。

正确案例

同时应用所有规则，我们得到以下函数：

function getAccountsTotalBalance(accounts) {
  let totalBalance = 0;
  for (let accountIndex = 0; accountIndex < accounts.length; accountIndex++) {
    totalBalance += accounts[accountIndex].balance;
  }

  return totalBalance;
}

虽然账户索引可能与i冲突，但函数的其余部分应该更清晰。 getAccountsTotalBalance 完全传达了该函数的目的，并且 get 前缀表明它不会导致突变。为了读者，代码作者付出更多的努力是值得的。 6 个月后，当他们维护代码时，未来的你会感激他们所做的额外工作。

如果您担心行长度，请考虑使用 Prettier 等工具来自动格式化代码。

总结

这些规则的目标是使我们编写的代码对未来的读者尽可能有意义。找到适合您环境的规则，如果某条规则弊大于利，请更改或放弃它。制定团队规则将帮助您表达对此事的想法，而不是冒犯同事。