前端代码规范一

最新推荐文章于 2024-05-13 09:46:26 发布
最新推荐文章于 2024-05-13 09:46:26 发布
阅读量188 收藏
点赞数
分类专栏： 前端 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wysxr/article/details/114593016
版权
本文详细介绍了前端代码规范，包括HTML、CSS和JavaScript的命名、HTML类型、CSS选择器使用、JS命名约定等，旨在提高代码可读性和团队协作效率。
摘要由CSDN通过智能技术生成

文章目录

前端代码规范

一、html-css-js篇

1.1 命名规范

1.1.1项目命名

​ 全部采用小写方式，以中划线分隔。

​ 正例：mall-management-system

​ 反例：mall_management-system / mallManagementSystem

1.1.2 目录命名

​ 全部采用小写格式，以中划线分隔，有复数结构时，要采用复数命名法，缩写不用复数

​ 正例：scripts / styles / components / images / utils / layouts / demo-styles / demo-scripts / img / doc

​ 反例：script / style / demo_scripts / demoStyles / imgs / docs

1.1.3 JS、CSS、SCSS、HTML、PNG 文件命名

​ 全部采用小写方式，以中划线分隔。

1.1.4 命名严谨性

​ 代码中的命名严谨使用拼音与英文混合的方式，更不允许直接使用中文的方式。即使纯拼音命名方式也要避免使用。

​ 杜绝完全不规范的缩写，避免望文不知义

​ 反例：AbstractClass 缩写 命名成AbsClass； condition 缩写 命名成 condi，此类随意缩写严重降低代码的可阅读性。

1.2 HTML 规范 （Vue Template 同样适用）

1.2.1 HTML 类型

​ 使用HTML5的文档类型说明：

  • 规定字符编码

  • IE 兼容模式

  • doctype大写

    正例：

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
最低0.47元/天 解锁文章
keepbao
关注
专栏目录
WEB前端编码规范
10-27
适用于公司的前端开发人员的规范，可以作为公司的前端开发人员的编码约束准则，同时对于所有前端开发人员是一份学习的文档，当前公司用的就是这份文档，我们所有开发人员入职的时候必须阅读的这一份文档，
前端代码规范
yf18040578780的博客
08-07 6997
前端代码规范
前端代码的规范
weixin_45784582的博客
10-12 574
一、HTML规范 （1）DOCTYPE声明 html文件必须加上DOCTYPE声明，并统一使用HTML5的文档声明： < ! DOCTYPE html > （2）页面语言 推荐使用 cmn-Hans-CN（简体，中国大陆），但考虑浏览器和操作系统的兼容性，目前仍然使用zh-CN < html lang="zh-CN"> （3）charset 字符集合 一般情况统一使用 “UTF-8” 编码 < meta charset=“UTF-8”> （4）代码缩进 统一使用四
前端代码规范(依据腾讯团队前端代码规范整理与补充）
热门推荐
weixin_38984030的博客
03-01 1万+
1.项目名称全部采用小写，以下划线分割。如my_project 2.目录命名全部采用小写，以下划线分割。有复数结构时，要采用复数命名法。 html 缩进使用soft tab（4个空格）； 嵌套的节点应该缩进； 在属性上，使用双引号，不要使用单引号； 属性名全小写，用中划线做分隔符； 不要在自动闭合标签结尾处使用斜线（HTML5 规范 指出他们是可选的）； 不要忽略可选的关闭标签，例...
这是借鉴、引用的是京东前端代码规范。
05-05
这是借鉴、引用的是京东前端代码规范。
前端代码规范.pdf
05-25
前端代码规范
前端代码规范.rar
11-25
"前端代码规范"这个压缩包文件很可能包含了一系列关于如何编写整洁、一致且易于理解的前端代码的指南。以下是对这些规范的一些核心内容的详细解读： 1. **命名规则**：前端代码规范通常会涵盖变量、函数、类以及...
前端代码规范文档，js，css，html等
10-20
前端代码规范文档@js、css、html 等 本文档旨在规范前端开发过程中的代码编写，涵盖 JavaScript、CSS、HTML 等多方面的规范，旨在提高代码的可读性、可维护性和可扩展性。 命名规范 1.1.1 项目命名：全部采用小写...
java、前端代码规范（阿里巴巴）.zip
03-29
Java和前端代码规范是软件开发中的重要组成部分，尤其是在大型企业如阿里巴巴这样的公司中，它们对于保持代码质量和团队协作至关重要。本压缩包包含了阿里巴巴制定的Java和前端开发的详细规范，帮助开发者遵循一致的...
HTML+CSS习题及面试题.pdf
08-07
124道HTML+CSS习题及面试题,前端、全栈开发面试必备；自建网站基础知识必备。来自2011腾讯前端面试稿。
JS中this上下文对象使用方式
11-23
JavaScript 有一套完全不同于其它语言的对 this 的处理机制。 在五种不同的情况下 ，this 指向的各不相同。 有句话说得很在理 — 谁调用它，this就指向谁 一、全局范围内 在全局范围内使用this ，它将指向全局对象（浏览器中为 window） var name = 'name1'; console.log(name); this.name = 'name2'; console.log(name); console.log(this.name); window.name = 'name3'; console.log(name); console.log(this.nam
前端代码开发规范总结
2401_84097774的博客
04-15 1947
必须使用 camelCase 驼峰命名必须指定类型必须加上注释，表明其含义必须加上 required 或者 default，两者二选其一如果有业务需要，必须加上 validator 验证props: { // 组件状态，用于控制组件的颜色 status: { type: String, required: true, validator: function (value) { return [ 'succ', 'info', 'error' ].indexOf(value)!
2024年前端最全前端代码开发规范总结，2024年最新京东前端面经
最新发布
2401_84411767的博客
05-13 408
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】必须使用 camelCase 驼峰命名必须指定类型必须加上注释，表明其含义必须加上 required 或者 default，两者二选其一如果有业务需要，必须加上 validator 验证。
大前端代码规范
AIGC大前端小王子
11-16 405
良好的代码规范，不仅能够让代码简洁清晰，还可以减少 bug 的出现，更能够让看代码的人赏心悦目。 一、HTML部分 1.1 代码规范 （1）所有属性都用双引号来标记，不使用单引号； （2）遵循语义化，尽可能的根据内容选择合适的标签，不乱用标签； （3）代码缩进统一4个空格长度，推荐使用vscode的indent-rainbow插件。 （4）在vue中，如果标签属性超过两个，每个属性应单独一行显示，同时注意缩进，例如： 1.2 注释规范 （1）注释内容前后都要有一个空格，并且位于要注释代码的上面，单独占.
（六）Javascript 规范
lj1530562965的博客
10-26 933
Javascript 规范命名代码格式字符串对象声明使用 ES6,7括号undefined 判断条件判断和循环最多三层this 的转换命名慎用 console.log分号注释 命名 1) 采用小写驼峰命名 lowerCamelCase，代码中的命名均不能以下划线，也不能以下划线或美元符号结束 反例： name / name / name$ 2) 方法名、参数名、成员变量、局部变量都统一使用 lowerCamelCase 风格，必须遵从驼峰形式。 正例： localValue / getHttpMessage
【开发规范系列】（四）前端开发规范
程序员朱永胜
08-30 214
代码的字里行间流淌的是软件系统的血液，质量的提升是尽可能少踩坑，杜绝踩重复的坑，切实提升系统稳定性，码出质量。页面跳转，例如从 A 页面跳转到 B 页面，需要将 A 页面的数据传递到 B 页面，推荐使用路由参数进行传参，而不是将需要传递的数据保存在 vuex，然后在 B 页面取出 vuex 中的数据，因为如果在 B 页面刷新会导致 vuex 数据丢失，导致 B 页面无法正常显示数据。避免大量的嵌套规则。当在组件中使用 data 属性时（除了 new Vue 外的任何地方），它的值必须是一个返回对象的函数。
遵循京东前端代码规范，提升开发效率与质量
"本文档是关于前端代码规范的介绍，主要参考了京东的前端代码规范，旨在提升团队协作效率，保证代码质量，并为开发奠定基础。文档内容涵盖HTML规范、图片规范、CSS规范和命名规范，JavaScript规范则暂时未详述。" ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值