JavaScript变量：变量命名原则

我会带着你远行 2022-06-14 01:55 198阅读 0赞

变量的命名相对而言没有太多的技术含量，今天整理有关于变量命名相关的原则，主要是想告诉大家，虽然命名没有技术含量，但对于个人编码，或者说一个团队的再次开发及阅读是相当有用的。良好的书写规范可以让你的JavaScript代码更上一个台阶，也更有利于团队的再次开发和阅读代码。

## 全名原则 ##

*  变量名区分大小写，允许包含字母、数字、美元符号(`$`)和下划线，但第一个字符不允许是数字，不允许包含空格和其他标点符号
 *  变量命名长度应该尽可能的短，并抓住要点，尽量在变量名中体现出值的类型
 *  尽量避免使用没有意义的命名
 *  禁止使用JavaScript关键词、保留字全名
 *  变量名命名方法常见的有匈牙利命名法、驼峰命名法和帕斯卡命名法

## 变量命名方法 ##

变量命名的方法常见的有匈牙利命名法、驼峰命名法和帕斯卡命名法。这里简单来看看这三种命名法的使用以及它们的不同之处。

### 匈牙利命名法 ###

[匈牙利命名法][Link 1]匈牙利命名法是电脑程序设计中的一种变量命名规则，此命名法又可细分为：系统匈牙利命名法和匈牙利应用命名法。

匈牙利命名法具备语言独立的特性，并且首次在BCPL语言中被大量使用。由于BCPL只有机器字这一种数据类型，因此这种语言本身无法帮助程序员来记住变量的类型。匈牙利命名法通过明确每个变量的数据类型来解决这个问题。

在匈牙利命名法中，一个变量名由一个或多个小写字母开始，这些字母有助于记忆变量的类型和用途，紧跟着的就是程序员选择的任何名称。这个后半部分的首字母可以大写，以区别前面的类型指示字母。

匈牙利命名法:

变量名＝数据类型+对象描述

*  数据类型：指点是JavaScript中六种数据类型之一,`undefined`、`null`、`boolean`、`number`、`string`和`Object`
 *  对象描述：指对象名字全称或名字的一部分，而且要有明确含义，易记而且还要好理解

> 有ES6之后，数据的类型不再是六种了，其新增加了Symbol这个新数据类型，有关于Symbol的相关介绍，可以阅读这篇文章《[深入解析ES6: Symbol][ES6_ Symbol]》。

先来看个示例

var aPerson = []; // Array数组 var oBtn = document.getElementById('btn'); //Object对象 var fnName = function () {}; // function函数 var sName = "w3cplus"; // string字符串

如上面的示例中的变量名称`aPerson`、`oBtn`、`fnName`或者`sName`。每个变量名前都有代表数据类型的对应字母，然后后面紧跟有意义的单个单词名多个单词，并且单词的字母都大写（其实这种方法，称之为驼峰写法，后面会介绍）。

JavaScript变量名中代表数据类型都有对应的字线，如下所示：

*  `s`: 表示字符串String
 *  `i`: 表示整型Int(它是Number中的整数类型)
 *  `fl`: 表示浮点Float(它是Number中的小数类型)
 *  `b`: 表示布尔Boolean
 *  `a`: 表示数组Array
 *  `o`: 表示对象Object
 *  `fn`: 不示函数Function
 *  `re`: 表示正则Regular Expression

有关于匈牙利命名更多的细节可以[点击这里][Link 1]阅读。

### 驼峰命名法 ###

当变量名和函数名称是由二个或多个单字链接在一起，而构成的唯一识别字时，利用“驼峰式大小写”来表示，可以增加变量和函数的可读性。

“驼峰式大小写（Camel-Case）一词来自Perl语言中普遍使用的大小写混合格式，而Larry Wall等人所著的畅销书《Programming Perl》（O'Reilly出版）的封面图片正是一匹骆驼。”

“驼峰式大小写”命名规则可视为一种惯例，并无绝对与强制，为的是增加识别和可读性。一旦选用或设置好命名规则，在程序编写时应保持一致格式。

驼峰命名法常见有两种格式：

*  小驼峰式命名法（lower camel case）：第一个单字以小写字母开始；第二个单字的首字母大写，例如：`firstName`、`lastName`。
 *  大驼峰式命名法（upper camel case）：每一个单字的首字母都采用大写字母，例如：`FirstName`、`LastName`、`CamelCase`，也被称为[Pascal命名法][Pascal]。

有关于驼峰式命名方法更多的介绍，可以[点击这里][Link 2]阅读。

### 帕斯卡命名法 ###

Pascal命名法（Pascal Case，巴斯卡命名法／帕斯卡命名法），电脑程序编写时的一套命名规则（惯例）。

当变量名和函数名称是由二个或二个以上单字链接在一起，而构成的唯一识别字时，用以增加变量和函数的可读性。

单字之间不以空格断开或连接号（`-`）、下划线（`_`）链接，第一个单前缀字母采用大写字母；后续单字的首字母亦用大写字母，例如：`FirstName`、`LastName`。每一个单字的首字母都采用大写字母的命名格式，被称为“Pascal命名法”，源自于Pascal语言的命名惯例，也有人称之为“大驼峰式命名法”（Upper Camel Case），为驼峰式大小写的子集。

“Pascal命名法”可视为一种命名惯例，并无绝对与强制，为的是增加识别和可读性。一旦选用或设置好命名规则，在程序编写时应保持格式的一致性。

有关于帕斯卡命名法更详细的介绍可以[点击这里][Link 3]阅读。

虽然上面三种方法在JavaScript中命名变量常见的方法，也是很多规范推荐使用的命名方法；但除此之外还有别的方法。比如说变量名有两个或多个单词时，可以在多个单词间使用`-`或`_`连接起来。如`first-name`或者说`first_name`。

## 总结 ##

文章简单介绍了一些有关于在JavaScript中变量命名的一些原则。并且介绍了变量命名的常用的几种方法，比如匈牙利命名法、驼峰命名法和帕斯卡命名法等。不管使用什么方法来命名一个变量，但文章开始提到变量名区分大小写，允许包含字母、数字、美元符号(`$`)和下划线，但第一个字符不允许是数字，不允许包含空格和其他标点符号和变量名禁止使用JavaScript关键词、保留字全名这两点，不然很容易给代码带来灾难性的错误。

如需转载，烦请注明出处：[http://www.w3cplus.com/javascript/variable-naming-principles.html][http_www.w3cplus.com_javascript_variable-naming-principles.html]

学无止境，贵在积累

[Link 1]: https://zh.wikipedia.org/wiki/%E5%8C%88%E7%89%99%E5%88%A9%E5%91%BD%E5%90%8D%E6%B3%95
[ES6_ Symbol]: http://www.w3cplus.com/javascript/es6-in-depth-symbols.html
[Pascal]: https://zh.wikipedia.org/wiki/Pascal%E5%91%BD%E5%90%8D%E6%B3%95
[Link 2]: https://zh.wikipedia.org/wiki/%E9%A7%9D%E5%B3%B0%E5%BC%8F%E5%A4%A7%E5%B0%8F%E5%AF%AB
[Link 3]: https://zh.wikipedia.org/wiki/%E5%B8%95%E6%96%AF%E5%8D%A1%E5%91%BD%E5%90%8D%E6%B3%95
[http_www.w3cplus.com_javascript_variable-naming-principles.html]: http://www.w3cplus.com/javascript/variable-naming-principles.html