统一的变量命名和封装可以让我们在面对复杂逻辑时，逐步抽调，思路清晰。
封装要简易，要透明，抽象的层次要高，甚至尽量的少想着封装，直到真的觉得要封装一下，封装是要复用的，是为了以后发生变化便于修改，易于维护，所以一些代码看着一模一样，实际封装的意义却不大。日常重复而已。
变量命名上，要简单且具有区分性，不要强行用变量去解释现实中的事物,或者与业务上的场景挂钩，远不如多加几行注释。
0. CSS
每个单词之间应 - 分割
用于包裹其他元素，方便定位和公共样式设置的用wrapper结尾 .left-wrapper，是群组选择器很好的替代。
id
id 选择器以id 结尾 #collect-id
id的主要功能是唯一性，确保同一个ID不要在同一个url里出现两次，命名要尽可能精准，通常是项目中的具体模块，名字很好取。
在使用预编译语言后，可以方便写出下面代码，比如less,防止css样式的全局污染，做到很好的隔离性
#collect-id{
.name{
}
}
clsss
class代表可复用的东西，所以命名要尽量的抽象而不具体，可以配合属性选择器来具体化，便于使用和维护。
.red{
}
.green{
}
.color{
&[type='red']{
}
&[type='green']{
}
}
子元素选择器和后代选择器
应有意识的区分这两个，更多的时候使用>可以避免样式的相互影响，有意的作用于后代元素，才使用后台选择器。
1 JS
变量驼峰命名 configModal
属性用名词，方法用动词开头
绑定在DOM元素的方法以on开头
数组以list结尾，DOM元素以DOM结尾。
bollean类型以is开头，平且只有is开头的变量才可以
if(isShow){
}
else{
}
否则只能
if(type === '1'){
}
else if(type === '2'){
}
即便当前只有两种情况
js是弱类型语言,虽然提供了便利之处，但使用时应有清晰的认识，除非明确要忽略类型,比如后台返回的字符串1，而前端定义的类型是数字，使用双等无妨，否则，应优先使用全等
if、else和switch
前者有更高的抽象，通常表示不同的行为、模式、场景，伴随不同业务代码，即便是单独if只有一条语句也要带上{}
if(isShow){
alert(1)
}
后者明确的区分，对数据的有限分类，比如一年只有12个月，三角形只有三条边，每个case分支代码量要少，比if、else可读性好.
字符串转数字时使用+
+"1"号等同于Number("1"),想要调用Number类型的方法可以(12).isNaN()
数组是否包含某项使用includes ，判断位置使用indexOf，还有map 、forEach这些。
ajax请求统一以request开头。
函数传参以arg开头，传参明确表达函数执行对外界数据的依赖，当参数过多时，应考虑传递一个对象。
网友评论