互联网行业前端组前端组长前端代码规范手册（执行版）.docxVIP

互联网行业前端组前端组长前端代码规范手册（执行版）

第1章基础规范

1.1代码命名规范

代码命名是前端开发中最基础的实践之一，直接影响团队协作效率和代码可维护性。命名不统一，就像没有路标的森林，每次寻找变量或组件都会耗费额外时间。

1.1.1变量命名

-通用原则：使用小写字母，单词间用中划线分隔（kebab-case）。例如：`user-profile`,`api-error-message`

-状态变量：以`$`或`is_`开头，明确表示布尔类型。如：`$is-loading`,`is-error`

-专业场景：

-ReactHook：`useFetchData`（约定优于随意命名）

-CSS变量：`--color-primary`,`--font-size-body`

1.1.2函数命名

-行为动词开头：`fetchData()`,`validateInput()`

-组件命名：使用PascalCase，首字母大写。如：`UserProfileComponent`

-性能优化：避免过长命名，超过15字符的函数考虑重构（研究表明，长函数代码密度降低37%）

1.1.3组件命名

-场景化命名：`ProductCard`,`ModalDialog`

-避免抽象：不要用`Bo