在编写 JavaScript 代码时，变量命名是提升代码可读性和维护性的重要环节。良好的命名习惯不仅能让代码更易理解，还能减少调试和协作中的困扰。以下是 9 条 JavaScript 变量命名的最佳实践。

避免使用 var：使用 let 和 const 替代

var 是 ES6 之前的变量声明方式，但它容易带来作用域混乱的问题。现代 JavaScript 推荐使用 let 和 const，它们具有块级作用域和更好的行为预测性。

• let：用于值会发生变化的变量。
• const：用于值不会发生变化的常量，优先使用。

变量名要清晰且描述性强

变量名应直接反映其内容和用途，避免使用无意义的缩写或单字母变量名。

• ✅ 好例子: firstName, totalPrice, productDescription
• ❌ 坏例子: x, a, temp

遵循驼峰命名法

在 JavaScript 中，驼峰命名法是最常用的命名规范。首字母小写，单词间用大写字母分隔。

• ✅ 好例子: fullName, dateOfBirth, shippingAddress
• ❌ 坏例子: full_name, dateofbirth

常量使用全大写字母

对于不会改变的常量，使用大写字母和下划线分隔单词。

• ✅ 好例子: TAX_RATE, API_KEY, MAX_ATTEMPTS
• ❌ 坏例子: taxRate, apiKey

避免使用单字母变量名

除了循环计数器（如 i）等特殊情况外，应尽量避免单字母变量名。

• ✅ 好例子: counter, index, sum
• ❌ 坏例子: i, j, k

数组使用复数命名

数组变量应使用复数形式，以表明它包含多个元素。

• ✅ 好例子: productNames, orderItems, employeeList
• ❌ 坏例子: productName, orderItem

布尔变量加前缀

布尔类型变量可加上 is、has 或 can 等前缀，清晰表达其含义。

• ✅ 好例子: isActive, hasDiscount, canEdit
• ❌ 坏例子: active, discountApplied

按作用域命名

根据变量所在的作用域，适当添加前缀或后缀，帮助理解它的作用范围。

• ✅ 好例子: globalCounter, localIndex, moduleConfig
• ❌ 坏例子: counter, index

每行声明一个变量

为了提升可读性，应避免多变量一行声明。

• ✅ 好例子:

let isActive = false;  
let canEdit = true;

• ❌ 坏例子:

let isActive = false, canEdit = true;

结论

良好的变量命名习惯是高质量代码的基石。通过遵循这些实践，您可以大大提高代码的清晰度和可维护性，使团队协作更加顺畅。选择适合您项目的命名规范并始终坚持下去，长远来看将为您节省大量时间和精力。

本文首发于公众号“web前端开发之旅”，转载请注明出处！