作为初学者开发人员，提高您的代码技能可能是您的首要任务之一。但你从哪儿开始呢？有这么多信息，很难知道哪些技术值得学习，哪些技术可以真正帮助你编写更好的代码。

在这篇博文中，我们将分享 10 种适合初学者的技巧，它们将帮助您立即编写更好的代码。因此，如果您准备好将您的编码技能提升到一个新的水平，请继续阅读！

1. 从计划开始

编写更好的代码的最佳方法之一是从计划开始。在开始编码之前，请花几分钟时间考虑一下您希望您的代码做什么。

不要仅仅因为你认为你知道需要做什么就开始编写代码。花一些时间来真正理解手头的问题。

• 输入和输出是什么？
• 预期的结果是什么？
• 从一个到另一个的过程涉及哪些步骤？
• 你需要什么数据结构？
• 是否有任何需要考虑的边缘情况？

在开始编码之前回答这些问题可以帮助您避免在兔子洞中迷失数小时或数天。它使您有机会巩固您对项目将如何工作的心理概念，根据任何明显的神奇思维飞跃验证它，并开发一组测试用例来检查您的工作。

挥舞它可能很有趣（而且通常很诱人），但这种方法不需要以限制性的方式束缚你或花费数小时的时间。即使在你启动编辑器之前在纸上画出几分钟的草图也会带来巨大的收益。

对需要做的事情有一个清晰的理解，可以让你把你的想法变成一个具体的计划。即使您开发的高级程序结构并不完美（让您内心的完美主义者摆脱困境 – 它不会是！），您会发现生成的代码更易于阅读并且扩展代码的复杂性大大增加更易于管理。

虽然您的代码会更简洁，但如果您确定了一些未知数并制定了计划，您将真正受益于节省的无数时间来解决本可以避免的问题。这是为解决更高级的问题和培养有益于您和您的职业的技能而获得的无数小时。

制定高层计划的技巧

1. 对您要解决的问题有一个清晰的认识。
2. 在开始编码之前，请花一些时间考虑一下您希望代码做什么来解决该问题。
3. 在开始编码之前编写伪代码。伪代码是还不是真正的代码的代码。它对于勾勒出代码结构很有用，而不会陷入细节中。
4. 画一张图。可视化问题可以帮助您更好地了解需要做什么以及不同部分如何组合在一起。
5. 检查你的工作。一旦你有了一个计划，检查它是否有任何明显的魔法思维飞跃，并确保它是可行的。
6. 使用内联注释来解释您的思考过程。编写代码后，请包含内联注释以解释您在做什么以及为什么。当您或其他人稍后返回代码时，这些注释会非常有用。如果您正在处理一个可能会让其他人感到困惑的复杂问题，则尤其如此。

2. 写出有意义的变量和函数名

编写良好的代码的标志之一是易于阅读和理解。使代码易于阅读的很大一部分是使用有意义的变量和函数名称。

为事物取好名字很难。但这很重要，即使在 Web 开发中也是如此。当人们试图理解您的代码时，您的变量和函数名称通常是他们首先要看的东西。

考虑以下示例：

let x, y, z;

function f() { 

// function

}

这段代码不是很容易阅读。x、y 和 z 分别代表什么？f() 有什么作用？

现在考虑这个例子：

let firstName, lastName;

function printFullName(firstName, secondName) { 

// function

}

这段代码更容易阅读。变量名提供信息，函数名让我们很好地了解它的作用。

在审查代码时，您也更有可能发现错误。当名称具有描述性时，更容易发现错误——比如将错误的变量传递给函数。否则，您必须始终在工作记忆中保留该变量的含义。

很容易记住我们为什么定义变量a，但是在你的工作记忆中保存密码会变得非常快——远在你定义z之前。这成为一个认知瓶颈，会严重限制您能够管理的复杂性范围。

您还应该采用一致的样式来格式化名称。当人们在开发中提到命名约定时，他们通常谈论的是使用大写和分隔符来增强可读性的方式。

以下是您在开发中最常看到的命名约定：

• 驼峰式：变量名写成一系列连在一起的单词，除了第一个单词以外的每个单词都以大写字母开头。示例：名字、姓氏、printFullName()。骆驼案例在 JavaScript 中很常见。
• 帕斯卡大小写：帕斯卡大小写类似于驼峰大小写，但第一个单词也是大写的。示例：FirstName、LastName、PrintFullName()。
• 蛇形大小写：蛇形大小写使用所有小写字母和下划线来分隔单词。示例：first_name、last_name、print_full_name()。
• Kebab 案例： Kebab 案例类似于蛇案例，但使用连字符而不是下划线。示例：名字、姓氏、打印全名（）。

一旦你选择了一个命名约定，重要的是要保持一致并坚持下去。

例如，您可能决定对变量名使用驼峰式 (firstName)，对函数使用蛇形 (print_full_name())。在这种情况下，使用不同的约定使得一致性对于可读性尤其重要。您已经暗示每个命名约定都有其含义。

如果这种情况随机变化，其他需要解释您的代码的人将不得不放慢速度并可能会误解它，或者只是不得不放慢速度并施加更多不必要的关注。

编写清晰变量名的提示

变量和函数名称应为：

• 描述性的。
• 易于记忆和发音。
• 与代码中的其他名称一致。

为此，您应该：

• 使用描述性名称。变量或函数的名称应描述其用途。
• 避免使用单个字母的名称，除非从上下文中可以非常清楚地了解其含义。例如，在 for 循环中使用 i 作为索引通常是可以的，因为这是一个常见的约定。
• 避免幻数。幻数是在代码中使用的数字文字，但没有明确解释其含义。
• 确定一个命名约定，然后坚持下去。
• 与往常一样，注释您的代码。当一个清晰的名称还不够，您确实需要查看原始函数或变量时，您将能够快速刷新您的记忆。

当你为事物取名时，问自己以下问题：

• 这个变量或函数是干什么用的？
• 它的名字是否描述了它的目的？
• 我的发音和发音容易记住吗？
• 是否与代码中的其他名称一致？

如果您无法轻松回答所有这些问题，那么选择不同的名称可能是个好主意。

3. 编写小型模块化函数

函数是程序员工具箱中最强大的工具之一。它们允许您处理一个大问题并将其分解为更小、更易于管理的部分。

较小的函数更容易测试、更容易调试和更容易重用。它们还使您的代码更具可读性，因为每个函数的用途都很明确。

考虑这个例子：

function multiplySquaredNumbers(x, y) {
  let xSquared = x * x;
  let ySquared = y * y;
  return xSquared * ySquared;
}

console.log(multiplySquaredNumbers(5, 6)); // Output: 360

正如你所看到的，这个函数有两个参数。它声明变量来管理输入参数平方的结果，以便后续行可以对它们进行操作。在这里，这发生在返回行上，当这些变量在一个数字被传递回调用者之前相乘时。

我们还有其他方法可以简化此功能，您可能已经发现了。这是一个：

function multiplySquaredNumbers(num1, num2) {
    return Math.pow(num1, 2) * Math.pow(num2, 2);
}

console.log(multiplySquaredNumbers(2, 3));

但是为了演示模块化代码的实用性，我们将把数字平方的过程外包给它自己的函数。

function square(x) {
  return x * x;
}

function multiplySquaredNumbers(x, y) {
  return square(x) * square(y);
}

console.log(multiplySquaredNumbers(5, 6)); // Output: 360

乍一看，很难看出这种方法如何帮助我们编写更好的代码。这个例子太简单了（并且依赖于太多的基本运算符）来减少代码行数。事实上，我们添加了一对。

简洁的代码总是比不必要的冗长代码更受欢迎。但是，除非您正在完成代码挑战，否则不要以健壮、可读的代码为代价来实现它。

重要的是要理解代码模块化并不是在你的代码中苦苦追求极简主义。这是关于在问题再次出现时从您花在解决问题上的时间中受益。

现在，将来任何时候我们想要对一个数字进行平方运算，我们都可以使用我们的模函数来完成这项工作，即使我们再也不需要将两个平方数相乘。我们已经告诉计算机如何完成这项工作。我们不妨从中受益！

如果我们采用原始示例中的方法，我们将不得不告诉解释器在我们想要对一些数字进行平方以进行后续操作时如何进行。

这是一个简单的示例，但它说明了如何使用函数将较大的问题分解为较小的部分。

您需要反复解决的问题在 Web 开发中通常更复杂。例如，您可能需要显示来自 API 调用的数据列表。这涉及获取数据、对其进行迭代以及动态创建在页面上显示部分数据的元素。

解决这个问题一次很好，但如果每次调用 API 或更新数据列表时都需要这样做，则必须复制大量代码。这将很快变得难以管理，尤其是随着可能需要显示此列表的不同位置的数量增加。

相反，您可以创建一个函数来获取一些数据并返回在页面上显示该数据所需的元素。然后，无论何时您需要创建这些元素，您都可以使用适当的数据调用该函数。这将使我们能够保持我们的代码 DRY 并避免重复自己。

编写模块化函数的技巧

在编写模块化函数时，您可以遵循一些最佳实践：

通过赋予它们单一职责来保持功能小

当你在写一个函数时，想想它应该做什么并且只让它去做。

编写一个可以一次性完成所有操作的大型、包罗万象的函数可能很诱人。但这会使您的代码更难推理并且可能导致错误。

通常最好编写几个小函数，每个函数都做一件事。这些更容易测试，更有可能在代码的不同部分重用。

描述性地命名你的函数

函数名称应该清晰且具有描述性，以便您（和其他开发人员）在阅读代码时可以轻松理解他们所做的事情。我们已经讨论过命名，但这对于在整个代码库中重复使用的函数尤其重要。

避免副作用

如果一个函数修改了其范围之外的内容，则称该函数具有副作用。例如，将数组作为参数并对数组进行排序的函数将被认为具有副作用。

没有副作用的函数称为纯函数。这些通常是首选，因为它们更容易预测。

总是很难避免副作用，但在编写函数时要牢记这一点。

明智地使用论据

当您决定在函数中包含哪些参数时，请考虑它们是否真的有必要。

参数通常用于使函数更灵活，以便可以在不同的情况下使用。但是太多的参数会使函数难以理解和使用。

通常最好包含较少数量的精心选择的论点，而不是包含大量不太重要的论点。