• 前端HTML CSS JS风格规范


    本文代码规范来自HTML/CSS代码开发规范文档

    文件命名规范

    使用小写字母、数字和下划线组成文件名
    避免使用特殊字符和空格。
    使用语义化的命名,能够清晰地表达出文件的功能或内容。
    目录结构规范

    使用约定俗成的目录结构,如:src/components/、src/assets/等。
    将不同类型的文件放置在不同的目录下,如:JavaScript文件放在src/目录下,样式文件放在src/styles/目录下。

    缩进规范

    使用两个空格进行缩进。
    不要使用制表符进行缩进。

    注释规范

    使用单行注释 // 或多行注释 /* */。
    在函数、类、变量等定义前添加注释,说明其功能和用途。
    在复杂的逻辑处添加注释,解释代码的作用和实现方式。
    空行规范

    在函数、类、变量等定义之间使用一个空行分隔。
    在条件语句、循环语句等控制结构中,每个语句块之间使用一个空行分隔。

    代码换行规范

    每行代码长度不超过80个字符。
    长表达式可以使用括号进行换行,但要保持括号的对齐。

    变量声明规范

    使用 const 声明常量,使用 let 声明变量。
    变量名使用小驼峰命名法,第一个单词以小写字母开头,后续单词首字母大写。
    避免使用全局变量,尽量将变量限制在局部作用域内。

    函数声明规范

    函数名使用小驼峰命名法,第一个单词以小写字母开头,后续单词首字母大写。
    函数参数使用逗号分隔,每个参数之间使用空格隔开。
    函数体使用大括号包裹,保持代码的整洁和可读性。

    事件处理规范

    使用 addEventListener 方法绑定事件。
    事件处理函数名使用小驼峰命名法,第一个单词以小写字母开头,后续单词首字母大写。
    避免使用内联事件处理器,将事件处理逻辑封装在独立的函数中。

    CSS规范

    将样式文件分离出来,放在单独的目录下。
    使用选择器时,避免使用过于具体的选择器,以提高代码的可维护性。
    使用预处理器(如Sass、Less)来编写样式,提高代码的可复用性和可维护性。
    使用CSS模块化技术(如CSS模块)来组织样式,避免样式冲突。

    JavaScript规范

    遵循ESLint或其他代码质量工具的规则。
    使用严格模式 ‘use strict’。
    避免使用全局变量,尽量将变量限制在局部作用域内。
    使用箭头函数替代传统的函数声明。
    避免重复的代码,将重复的逻辑封装在独立的函数中。
    使用Promise来处理异步操作,提高代码的可读性和可维护性。

    测试规范

    为重要的功能编写单元测试,确保代码的正确性。
    使用断言库(如Jest)来编写测试用例。
    将测试用例放在单独的目录下,与被测试的代码保持相同的目录结构。
    运行测试用例时,确保覆盖率达到一定的标准。

  • 相关阅读:
    机器学习——线性回归
    05 数据操纵之插入数据 | OushuDB 数据库使用入门
    2016-2023全国MPA国家A类线趋势图:浙大MPA要高多少?
    7.3 服务端漏洞:密码找回逻辑漏洞检测和重现
    MySQL数据库忘记密码之修改密码
    spring bean生命周期内拦截点和场景运用
    王者荣耀图鉴皮肤怎么来的
    遗传力缺失的案例
    cefSharp 获取和设置 cookie
    什么是TB程序化接口?
  • 原文地址:https://blog.csdn.net/m0_63669388/article/details/133964216