前段时间在看一些规范性的东西记在了笔记上,今天在这里拿出来给大家分享一下,目前我采用(学习到)的一些规范约束 【后面会持续更新。。。。】
1.文件/资源命名
1.1 资源名全部小写
1.2 – 分割名称 .来描述后缀 (my-base.min.js)
2 协议
2.1 不要指定协议部分(http:, https:),除非这两者协议都不可用
eg:<script src=”//cdn.com/foundation.min.js”></script> 【推荐使用这种】
3 缩进
3.1 一次性缩进合适的空格(我用的2个)
4 格式化规则
4.1 在每一个块状元素,列表元素和表格元素后,加上一新空白行,并对其子孙元素进行缩进。内联元素写在一行内,块状元素还有列表和表格要另起一行。
4.2 HTML 使用双引号(“ ”) 而不是单引号(‘ ’) 。
5 IIFE
5.1 IIFE立即执行函数,使用这个可以防止全局命名空间被污染
推荐格式:
( function( ){ }( ) )
5.2 严格模式,最好放在独立的IIFE里面使用,ECMAScript 5 严格模式可在整个脚本或独个方法内被激活。它对应不同的 javascript 语境会做更加严格的错误检查。严格模式也确保了 javascript 代码更加的健壮,运行的也更加快速。
eg:
(function(){
'use strict';
// Your code starts here
}());
6 字符串
6.1 js统一使用单引号(‘),不使用双引号(“)。这在创建 HTML 字符串非常有好处
7 变量赋值时的逻辑操作
7.1 逻辑操作符 || 和 && 也可被用来返回布尔值。如果操作对象为非布尔对象,那每个表达式将会被自左向右地做真假判断。基于此操作,最终总有一个表达式被返回回来。这在变量赋值时,是可以用来简化你的代码的。
8 css/scss
8.1 class/id 命名语义化
8.2 CSS选择器中避免标签名
8.3 省略“0”值后面的单位。不要在0值后面使用单位,除非有值。
8.4 CSS提供了各种缩写属性(如 font字体)应该尽可能使用,即使在只设置一个值的情况下。
使用缩写属性对于代码效率和可读性是有很有用的。
8.5 声明顺序:
这是一个选择器内书写CSS属性顺序的大致轮廓。这是为了保证更好的可读性和可扫描重要。
作为最佳实践,我们应该遵循以下顺序(应该按照下表的顺序):
结构性属性:
display |
---|
position |
left |
top |
etc |
overflow |
float |
clear |
etc |
margin |
padding |
表现性属性:
background |
---|
border |
etc |
font |
text |
8.6 属性和值(但属性和冒号之间没有空格)的之间始终使用一个空格
8.7 每个选择器和属性声明总是使用新的一行。
8.8 属性选择器或属性值用双引号(””),而不是单引号(”)括起来。url值(url())不要使用引号。
8.9当使用Sass的嵌套功能的时候,重要的是有一个明确的嵌套顺序,
以下内容是一个SCSS块应具有的顺序。
当前选择器的样式属性
父级选择器的伪类选择器 (:first-letter, :hover, :active etc)
伪类元素 (:before and :after)
父级选择器的声明样式 (.selected, .active, .enlarged etc.)
用Sass的上下文媒体查询
子选择器作为最后的部分
持续更新中!