前端编码规范

Posted 2022-10-28 秋水不寒

以下为小组代码提交时git批注规范，请各位在提交代码时严格遵守，方便大家对工作代码追踪
    

提交git代码批注规范

一、本人直接提交
1、一般，提交代码要求功能任务完成便提交，除有依赖情况可提前提交
2、提交批注格式：
 Dev/Fix/BugFix/Mod-任务序号（wbs中序号）-任务名（wbs中任务名）-状态（百分比，无需百分号，同wbs汇报工作状态）-特殊说明

3、特殊说明情况：
（1）直接开发完成的，无需添加特殊说明
（2）功能开发完成后，内部review或内部联调问题修正，使用Fix标签，说明Fix内容
（3）功能开发完成后，提交测试时的bug修正，使用'测试阶段(FVT/SIT/UAT)+Fix'标签，说明bug内容
（4）功能提测结束后（任意阶段的测试均可）的需求变更调整，Mod调整说明
（5）新增util说明，如有他人util依赖可以提前提交代码，否则请与开发一并提交

4、用例： 
（1）完成开发：
Dev-8.3.4.1-需求计划查看（生成）-100

（2）开发完成，内部review或内部联调问题修正（百分比为该功能中的具体某修正的完成状态）：
Fix-8.3.4.1-需求计划查看（生成）-100-明细列表处理循环嵌套过深

（3）测试提出bug后的功能bug修正（百分比为该功能中的具体某bug修正状态）：
FVT-Fix-8.3.4.1-需求计划查看（生成）-100-点击查看无效

（4）开发完成后的需求变更导致功能调整（百分比为功能调整的完成百分比）：
Mod-8.3.4.1-需求计划查看（生成）-100-某画面按钮功能调整

（5）做某项任务时的新增util，其中百分比为功能的2%固定，标签使用Dev固定：
Dev-8.3.4.1-需求计划查看（生成）-2-新增计划状态枚举类

二、同分支由于代码先后版本导致merge
  1、一般的：
  备注无需更改直接提交
  2、特殊情况：
  代码merge差异大时，SourceTree会列举merge代码内容，git不允许批注信息内容过多
  处理方式：
  删除merge文件说明或代码列举，仅保留如一般情况下的信息
  如：Merge branch 'master' of http://112.35.32.67:8817/scm4-dl/api-plan
  其中 'master'为 分支说明 of 之后为服务器git目录

三、不同分支进行左右merge
   目前代码全在master上进行开发，后续当出现不同分支时，以源向目标merge时
   批注内容参照第二点操作
   

javascript编码规范

书写JavaScript代码时需遵循Airbnb公司的JavaScript编码规范，参考链接： 英文版 | 中文版

JS风格一览表

结构
规则
备注

目录名
短横线命名并全部为小写字母

文件名
短横线命名并全部为小写字母
文件后缀名规则：路由引用的模版文件(.vue)使用 -pagevuex相关模块文件(module/*.js)使用 -module调用后端服务的service文件(service/*.js)使用 -service

类(Class)
首字母大写驼峰

函数
首字母小写驼峰

变量
首字母小写驼峰

常量
首字母大写驼峰(包含_)

Vue编码规范
Vue文件的编码需遵循 Vue官方风格指南
框架规范
所有代码
(Must) 业务相关的常数需使用由大写字母和_组成的常量进行定义和引用
Vue文件
(Must) 事件函数名需要使用 on 前缀
(Must) 控制组件显示/不显示，可用/不可用的变量逻辑必须定义在vue文件的 computed 属性中
(Must) 控制组件显示/不显示的变量后缀名使用 visible，可用/不可用的变量后缀名使用 disabled
(Must) 不允许在vue的函数内调用其他事件处理函数
(Must) 不允许直接修改计算属性中返回的一个属于 module 的对象，对于对象内项目值的变更，需要通过提交 mutation 进行修改。
Service文件
(Must) 为了减少因后端服务接口变化带来的影响，在service文件内需要对后端服务的输入参数和返回值进行变换处理
兼容性
前端页面需支持的浏览器为IE10+和其他现代浏览器。为了减少因兼容性导致的bug和性能，不允许使用ES7+语法。
具体可使用的
ES5语法可参考 ES5兼容性表格。
ES6语法可参考 ES6兼容性表格。
工程内已内置如下工具函数库：
数组、对象、字符串处理函数库 lodash
数据处理函数库 numeral
日期处理函数库 moment
ES5的严格模式下，以下情况下会显式的报错，所以要避免以下写法。
对未定义的变量赋值
操作被设置为不可写，不可配置或不可扩充的属性
删除变量，函数，参数
在对象直接量里重复定义属性
eval做关键字，在eval的字符串里定义变量
覆写arguments
使用arguments.caller和 arguments.callee（匿名函数必须具名才能引用自己）
(function() … ).call( null ); // Exception
使用with
特别注意

禁止扩展原生对象的原型，特别是Object.prototype。
不要在if的条件部分使用赋值表达式，如果确实想要在if条件部分赋值，那么把它括在另一对括号中，如：if ((a = b)) ...
parseInt的第一个参数的第一个字符是0时，该字符串将被基于八进制而不是十进制求值。所以使用parseInt方法时，建议总是提供第二个参数来指明基于十进制求值。
因为javascript遵循二进制浮点数算术标准，所以不能正确地处理十进制的小数，因此在js中 0.1+0.2 不等于 0.3。但js中的整数运算是精确的，所以在需要精确浮点运算的时候，建议可以先乘以10的阶乘，使用整数部分运算，运算完后再除以10的阶乘。

其他建议

使用代替 new Object()，使用[] 代替 new Array()；
某些情况下使用||或&&代替if，如 evt = evt || window.event；
不允许在if和while语句的条件部分赋值。如 if(evt=window.event)

   
   https://cn.vuejs.org/v2/style-guide/index.html