系统规范

代码风格

使用两个空格缩进；

使用驼峰命名法，变量、函数名以小写字母开头，类名以大写字母开头；

使用单引号或反引号表示字符串；

注释应该清晰明了，解释代码用途和实现方式，避免不必要的注释；

HTML/CSS/JavaScript 规范

HTML 标签应该遵循标准规范，语义化页面结构，避免使用无意义的 div 和 span；

CSS 样式应该遵循一致的命名规范，避免样式冲突和重复；

JavaScript 变量、函数应该遵循一致的命名规范，代码应该易于阅读和维护；

性能优化

减少 HTTP 请求，合并压缩静态资源，使用缓存机制

优化图片大小和格式，避免使用过多的动画效果

避免使用过多的第三方库和插件，尽可能优化代码性能

数组为空时：返回空数组；

JavaScript && vue *(代码细则)

在使用变量前，必须进行判空，必要时还需进行类型判断；若是对象，建议使用可选链（下面有后端返回数据类型格式）我们经常会遇到这样的情况：在定义变量时未赋默认值；根据接口返回值进行赋值，因数据等问题导致字段有缺失。若我们在使用这些变量时，未进行必要的判断，理所当然地去使用变量的属性、方法等，轻则导致console上出现一些error信息，再则出现功能无法正确运行，重则直接出现整个系统白屏！

instanceof()

只能用来判断变量的原型链上是否有构造函数的prototype属性（两个对象是否属于原型链的关系），不一定能获取对象的具体类型

Instanceof 不适用判断原始类型的值，只能用于判断对象是否从属关系

原理：因为A instanceof B 可以判断A是不是B的实例，返回一个布尔值，由构造类型判断出数据类型

分析：[].proto 的原型是指向Array.prototype 的，说明两个对象是属于同一条原型链的，返回true

注意

instanceof 后面一定要是对象类型，大小写不能写错，该方法试用一些条件选择或分支

对接口报错进行处理，至少需进行错误提示

目前系统中对接口错误状态码、错误提示的处理良莠不齐，导致部分接口一旦出错，页面无任何反应，对用户很不友好。

-针对接口出现一些错误状态码（如status: 500），后续会在组件库的interceptor中对所有axios进行统一处理，给出错误提示，并往外抛。各个业务层可以对组件库抛出的信息进行进一步的处理，如关闭loading，回退处理等等。

-针对接口status: 200 success: false，需要在各个调用接口的地方给出提示语。优先以后端返回为准，否则提示语默认为：系统异常，请联系管理员。

-针对接口返回blob文件或其他可能会出现异常的情况，建议使用try...catch来捕获异常。

信息

props 定义应该尽量详尽，至少指定类型这样做只有开发原型系统时可以接受

禁止在watch和computed中用$route

由于我们目前大部分都是keep-alive模式，若是在watch和computed中用$route，那么在包括tab页签打开、切换等操作在内的每一次路由变化，都会触发watch和computed，不论是否跟本页面本组件有关系。这样子带来了巨大的性能损耗和一些奇奇怪怪的缺陷产生

注释要保证详细、完整

推荐使用vscode的koroFileHeader插件，进行快捷注释操作。

文件注释去掉，可以留一个description；

代码有更新，注释记得也要更新；

后端数据类型返回

字典类型数据
举例为例
{ id : null,name:"测试" }
如果在 [ 查看 ] 阶段以 name为准 //查看的话不进行操作不需要使用下拉框文本框实现
如果是 [ 修改 ] 阶段 id 为 null 时下拉框展示空 // 因修改操作需要选择以id来绑定所以以id 为准

git提交
type：commit的类型
feat：新特性
fix：修改问题
refactor：代码重构
docs：文档修改
style：代码格式修改，非css
test：测试用例修改
chore：其他修改，比如构建流程，依赖管理
scope：commit影响的范围，比如：route，component，
utils，build。
subject：commit的概述
body：commit。具体修改
footer：备注

科研3.0前端代码规范

系统规范#

代码风格#

性能优化#

JavaScript && vue *(代码细则)#

系统规范

代码风格

性能优化

JavaScript && vue *(代码细则)