如何高效的命名你的项目。 
在做一个项目的时候，我们往往遭遇命名问题的困惑，当看到一些非专业人的代码，看到他们凌乱的码法，有时候真的苦不堪言。深刻知道一个良好的命名规范的重要性，同时在项目中也会遇到一些命名的瓶颈。所以有必要写一篇关于常见命名的方式。以下是通过3年的编程经验，以及参考网上知名的开源项目总结的一点经验。希望共勉 
1.文件夹命名

1)最好用一个单词描述

2)如果一个单词描述不了，用2个词（名词加动词）

color-pick、button-groups、date-picker、option-grounp、jquery-select、jquery-swiper

3)中间用-或者_连接为了方便归类、一目了然

node_models、async-demo、array-union、array-differ、babel-each

2.文件命名

1).最好用一个单词描述

以下变量名可以加css、js、html，例如index.html、index.js、index.css

2)如果一个单词描述不了，用2个词（名词加动词）

share-to-friends，share-to-community，weex-pay，alipay-pay，user-integral，game-page，docs-page等等反正就是自我想象

3)中间用-或者_连接为了方便归类、一目了然

在目前做的pc端和移动端，简单的对他们分个类：

• 移动广告(mobile-advertisement)

• 移动社交(mobile-social)

• 移动电子商务(mobile-bussiness)

• 手机游戏(mobile-game)

• 手机电视(mobile-tv)

• 移动电子阅读(mobile-reading)

• 手机搜索(mobile-search)

• 移动支付(mobile-pay)

• 手机内容共享(mobile-share)

关于以上的项目都可以用名词+需要的动词命名，达到见词知意

3.html布局命名

可以参考DIV+CSS规范命名大全集合但是我觉得写的并不是很好，很全面。因为往往比较纠结的是每一个大布局中小布局的命名。

总结

1)一般头部有nav、nav-event、nav-style、nav-item、nav-link。 
2)内容：xx-title、xx-box、xx-warp、xx-item、xx-item-title、xx-item-link、xx-item-image 
3)底部：footer-time、footer-box、footer-item、footer-item-link、footer-address。总之xx-wrap，xx-box，xx-item、xx-link、xx-title、xx-total肯定会满足你80%的需求

4.js变量命名

1)基础类型和引用数据类型

• 基础类型

• 字符串var s_count=”“,

• 布尔类型var b_status=false,

• 数字类型var n_total=12。

• 引用数据类型

• 数组var ar_bar=[],

• 对象var o_bar={},

• 函数var f_submit=function(){}

2)不要用关键字命名default、class、private 
3)用可读的同义词代替保留词。

// bad

var superman = {

 class: ‘alien‘

};

// bad

var superman = {

 klass: ‘alien‘

};

// good

var superman = {

 type: ‘alien‘

};

4)函数用驼峰形式（动词+名词）

login(),logout(),expandList(),getTotal(),keySearch(),submitForm(),cancel(),goMore(),searchAll>(),searchCurrent().clearContent().uploadImage().searchResult()这些都是常用事件，可以清晰知道每一项的意义。

5)当命名的构造函数和类使用PascalCase。

// bad

function user(options) {

 this.name = options.name;

}

var bad = new user({

 name: ‘nope‘

});

// good

function User(options) {

 this.name = options.name;

}

var good = new User({

 name: ‘yup‘

});

6)不要使用尾随或前导下划线

// bad

this.__firstName__ = ‘Panda‘;

this.firstName_ = ‘Panda‘;

this._firstName = ‘Panda‘;

// good

this.firstName = ‘Panda‘;

7)前缀jQuery对象变量与$

// bad

var sidebar = $(‘.sidebar‘);

// good

var $sidebar = $(‘.sidebar‘);

// bad

$(‘ul‘, ‘.sidebar‘).hide();

// bad

function setSidebar() {

 $(‘.sidebar‘).hide();

 // ...stuff...

 $(‘.sidebar‘).css({

   ‘background-color‘: ‘pink‘

 });

}

// good

function setSidebar() {

 var $sidebar = $(‘.sidebar‘);

 $sidebar.hide();

 // ...stuff...

 $sidebar.css({

   ‘background-color‘: ‘pink‘

 });

}

// bad

$(‘.sidebar‘).find(‘ul‘).hide();

// good

$(‘.sidebar ul‘).hide();

// good

$(‘.sidebar > ul‘).hide();

// good

$sidebar.find(‘ul‘).hide();

5.css命名

6.图片命名

1)第一部分是图片的逻辑归属分类 
2)第二部分是图片的表现内容 
3)第三部分是图片的内容的类型（有些图片还会有第四部分，表示图片表现的状态。） 
4)tabbar_home_icon, navigationbar_showtime_icon@2x.png，tabbar_categories_icon

文件命名