超全面的javascript中变量命名规则


Posted in Javascript onFebruary 09, 2017

前言

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

全名原则

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

匈牙利命名法

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

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

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

语法

变量名 = 类型 + 对象描述

  1. 类型指变量的类型
  2. 对象描述指对象名字全称或名字的一部分,要求有明确含义,命名要容易记忆容易理解。

通过在变量名前面添加相应小写字母的符号标示作为前缀,标示出变量的类型,前缀后面是一个或多个单词组合,单词描述了变量的用途。如果是 jquery 对象,则用 $ 作为变量名的前缀。

提示

虽然 javascript 变量表面上没有类型,但是 javascript 内部还是会为变量赋予相应的类型。

匈牙利命名法是一位微软程序员发明的,多数的 c,c++ 程序都使用此命名法。

类型

javascript 变量命名类型 变量命名前缀
array 数组 a
boolean 布尔值 b
float 浮点数 l
function 函数 fn
int 整型 i
object 对象 o
regular 正则 r
string 字符串 s

示例

var aName = [1, 2, 3];
var oBtn = document.getElementById('btn');
function fnName(){};
var iCount = 0;
var sName = "zhuyujia";

驼峰式命名法

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

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

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

语法

变量名或函数名是由一个或多个单词连结在一起,其中第一个单词以小写字母开始,后面的所有单词的首字母都采用大写字母,这样的变量名看上去就像骆驼峰一样此起彼伏,故得名。

示例

var myName = "zhuyujia";
var formSubmit = document.getElementById("submit");
function timeCount(){}

帕斯卡命名法

Pascal命名法(Pascal Case,巴斯卡命名法/帕斯卡命名法),电脑程序编写时的一套命名规则(惯例)。

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

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

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

语法

和驼峰式命名法类似,只不过第一个单词的首字母需要大写。

示例

var MyName = "zhuyujia";
var FormSubmit = document.getElementById("submit");
function TimeCount(){}

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
jQuery阻止冒泡和HTML默认操作
Nov 17 Javascript
JavaScript判断DOM何时加载完毕的技巧
Nov 11 Javascript
JS编程小常识很有用
Nov 26 Javascript
模拟用户点击弹出新页面不会被浏览器拦截
Apr 08 Javascript
JavaScript生成随机字符串的方法
Mar 19 Javascript
基于javascript html5实现3D翻书特效
Mar 14 Javascript
Angular.JS内置服务$http对数据库的增删改使用教程
May 07 Javascript
node 命令方式启动修改端口的方法
May 12 Javascript
搭建vue开发环境
Jul 19 Javascript
手动下载Chrome并解决puppeteer无法使用问题
Nov 12 Javascript
Vue结合后台导入导出Excel问题详解
Feb 19 Javascript
vue遍历生成的输入框 绑定及修改值示例
Oct 30 Javascript
简单的jQuery拖拽排序效果的实现(增强动态)
Feb 09 #Javascript
bootstrapValidator.min.js表单验证插件
Feb 09 #Javascript
js 原型对象和原型链理解
Feb 09 #Javascript
AngularJs表单校验功能实例代码
Feb 09 #Javascript
javascript 显示全局变量与隐式全局变量的区别
Feb 09 #Javascript
JS获取本周周一,周末及获取任意时间的周一周末功能示例
Feb 09 #Javascript
简单谈谈Javascript函数中的arguments
Feb 09 #Javascript
You might like
Php output buffering缓存及程序缓存深入解析
2013/07/15 PHP
php中通过curl检测页面是否被百度收录
2013/09/27 PHP
PHP开发框架Laravel数据库操作方法总结
2014/09/03 PHP
PHP使用pear自带的mail类库发邮件的方法
2015/07/08 PHP
Laravel使用Caching缓存数据减轻数据库查询压力的方法
2016/03/15 PHP
PHP自定义图片缩放函数实现等比例不失真缩放的方法
2016/08/19 PHP
PHP mongodb操作类定义与用法示例【适合mongodb2.x和mongodb3.x】
2018/06/16 PHP
jquery 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
2008/12/25 Javascript
jquery中this的使用说明
2010/09/06 Javascript
ExtJS 入门
2010/10/29 Javascript
javascript获取元素CSS样式代码示例
2013/11/28 Javascript
jquery判断元素的子元素是否存在的示例代码
2014/02/04 Javascript
JavaScript实现获取dom中class的方法
2015/02/09 Javascript
手机软键盘弹出时影响布局的解决方法
2016/12/15 Javascript
jQuery动态生成不规则表格(前后端)
2017/02/21 Javascript
ECMAScript6--解构
2017/03/30 Javascript
Javascript的console['']常用输入方法汇总
2018/04/26 Javascript
react-router 路由切换动画的实现示例
2018/12/03 Javascript
jQuery实现合并表格单元格中相同行操作示例
2019/01/28 jQuery
node.js命令行教程图文详解
2019/05/27 Javascript
JS实现返回上一页并刷新页面的方法分析
2019/07/16 Javascript
JavaScript大数相加相乘的实现方法实例
2020/10/18 Javascript
[01:12:53]完美世界DOTA2联赛PWL S2 Forest vs SZ 第一场 11.25
2020/11/26 DOTA
Python操作sqlite3快速、安全插入数据(防注入)的实例
2014/04/26 Python
Python爬虫包BeautifulSoup学习实例(五)
2018/06/17 Python
python使用Geany编辑器配置方法
2020/02/21 Python
python求numpy中array按列非零元素的平均值案例
2020/06/08 Python
Python QTimer实现多线程及QSS应用过程解析
2020/07/11 Python
利用css3画个同心圆示例代码
2017/07/03 HTML / CSS
英语自荐信范文
2013/12/11 职场文书
2016中秋节问候语
2015/11/11 职场文书
2016年大学生实习单位评语
2015/12/01 职场文书
2016国培研修心得体会
2016/01/08 职场文书
2019年农民幸福观调查的实践感悟
2019/12/19 职场文书
浅谈Python数学建模之数据导入
2021/06/23 Python
“鬼灭之刃”热度不减,其成功背后的原因是什么?
2022/03/22 日漫