前端开发项目开发规约

文件命名规约

• 项目名称
  小写，如下划线分隔
• 目录命名
  小写，多文件使用复数
• JS文件命名
  同项目名称同
• CSS, SCSS文件命名
  同项目名
• HTML文件命名
  同项目名

HTML代码规约

1. 语法

• 缩进，4空格
• 嵌套的节点加缩进
• 属性使用双引号
• 属性名小写，用中划线分隔
• 注意标签关闭

1. 一些规约

• 属性顺序

class
id
name
data-*
src, for, type, href, value , max-length, max, min, pattern
placeholder, title, alt
aria-*, role
required, readonly, disabled

• 少用js生成标签
• 减小标签数量

CSS, SCSS

• 缩进，4空格
• 结尾加分号
• 文件结尾加空行
• 颜色,16进制小写字母

JavaScript

• 缩进,4空格
• 单行长度不超过80个字符

• 分号使用

  • 变量声明
  • 表达式
  • return
  • throw
  • break
  • continue
  • do-while

• 空格使用
  不加空格

  • 对象的属性名后
  • 前缀一元运算符后
  • 后缀一元运算符前
  • 函数调用括号前
  • 数组的'['后和']'前
  • 对象的'{'后和'}'前
  • 运算符'('后和')'前
  • 函数声明或函数表达式，'('前不要空格

• 空行

  • 变量声明后（当变量声明在代码块的最后一行时，则无需空行）
  • 注释前（当注释在代码块的第一行时，则无需空行）
  • 代码块后（在函数调用、数组、对象中则无需空行）
  • 文件最后保留一个空行
• 引号，最外层使用单引号

• 变量命名

  • 标准变量采用驼峰式命名（除了对象的属性外，主要是考虑到cgi返回的数据）
  • 'ID'在变量名中全大写
  • 'URL'在变量名中全大写
  • 'Android'在变量名中大写第一个字母
  • 'iOS'在变量名中小写第一个，大写后两个字母
  • 常量全大写，用下划线链接
  • 构造函数，大写第一个字母
  • jquery对象必须以'$'开头命名