前端编码规范
规范有什么用?
能让每一个人出乎意料的轻松的阅读任意一段代码,并轻易的看懂它们
风格高度统一
提高可读性,促进团队协作
降低维护成本 (减少马良的粗口)
有助于写出质量更高、错误更少、更易于维护的程序
原则
无论团队人数多少,代码应该同出一门。
约定
Tab缩进==四个空格
每行代码字符数不超过120个
文件使用UTF-8编码
尽可能不写注释,除非很有必要
文件不能留有多余的空格、换行、不必要的注释
代码一定要格式化
命名
项目命名:全部采用小写方式, 以下划线分隔
例:my_project_name目录命名:参考项目命名,有复数结构时,要采用复数命名法。
例:scripts, styles, images, templates文件命名:全小写,以下划线分隔
例:image_preview.js如过项目是MVC结构,文件命名可以带上当前模块,便于搜索和理解app/scripts/controllers/login.controller.jsapp/scripts/services/login.service.js
HTML、CSS文件命名参考如上
语义化,准确的表达意图
JS编写规范
变量命名:驼峰命名法,小写字母开头。必须声明
函数命名:驼峰命名法,小写字母开头。规则:动词或动词+名词组合
let removeSession = function() {}let getUser = function() {}let isAdmin = function() {}let findMessagesByIdentifier = function() {}
类命名:驼峰命名法,首字母大写
每行代码结束必须有分号;
常量用全大写字母,下划线分割,如const HTTP_SUCCESS = 200;
空格,该有的空格的地方按代码格式化的标准
花括号
例:if (xx) { // do something }标准写法,其他都不规范,不允许if缩写
- 使用单引号
let name = '张三';
使用三目等,用===, !==代替==, !=;
严格模式,在js文件头部声明
'use strict';
一个function超过100行就必须要重构,10行内是比较理想的
一个文件只干一件事,文件行数不超过200行,否则说明模块化程度不够
去除else
例 if (xxx) { return; } // do something例 if (xxx) { // do something return; } if (xxx) { // do something return; } // do something
函数参数不能超过3个,可使用对象代替
一个值在代码上出现2次以上就需要提取为常量,防止散弹式编程
HTML编写规范
属性值必修双引号,禁止使用单引号
样式尽可能写到style文件
参考:https://github.com/fex-team/styleguide/blob/master/html.md
CSS编写规范
参考:https://github.com/fex-team/styleguide/blob/master/css.md
我们需要正规军,没有做到,那就是彻底的土匪军
关键字:编码规范, 命名, function, 代码
版权声明
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符,请点击 举报 进行投诉反馈!