前端变量命名常用方法

点击有惊喜

本文主要介绍常用的前端变量命名规则，主要包括JS, HTML的常用命名规则。

JS常用命名方法

常量

常量就是初始化后不会再改变的变量,此类变量一般用全大写+下划线的方法命名。
比如

var IMAGE_SERVER = 'http://img.alibaba.com';
var MAX_LENGTH = 200;

全局变量

在利用模块化变成以后，全局变量用得比较少了，但在VM输出的变量都是全局变量，全局变量的命名方法一般是g+变量名。

var gConfig = {
   a:1,
   b:2
};

私有变量

因为JS不支持私有变量，所以私有变量都是模拟出来的，业界通用JS私有变量的命名方法是下划线+变量名比如

var Student = Base.extend({
    _name: '小明'，
    getName: function(){
        return this._name;
    }
});

这里的name就是一个私有变量，一般下划线变量就意味着不要直接使用的变量。

html中的常用命名方法

属性不区分大小写

html是不区分大小写的，所以最好不要写 dataRole="abc",而应该是data-role。

命名方法为(角色+名字)

html中比较好的命名方式就是角色加上命名

比如

<div data-role="container-chatbox"> </div>
<a data-role="btn-chat"></a>

css常用命名方法

以中划线划分语义

比如 .container-component

常用的角色名

wraper : 最外的包裹层
container： 容器层
btn： 按钮

点击有惊喜