合同范文工作计划范文工作总结范文合作方案范文日志日报范文工作报告范文年终总结范文申请书范文通知书范文请假单范文活动策划范文活动报道范文简历范文委托书范文授权书范文论文范文简报范文志愿书
前端开发代码规范文档(精选5篇)
前端开发代码规范文档 第一篇
注释是你自己与你的小伙伴们了解代码写法和目的的唯一途径。特别是在写一些看似琐碎的无关紧要的代码时，由于记忆点不深刻，注释就变得尤为重要了。
编写自解释代码只是一个传说，没有任何代码是可以完全自解释的。而代码注释，则是永远也不嫌多。
当你写注释时一定要注意：不要写你的代码都干了些什么，而要写你的代码为什么要这么写，背后的考量是什么。当然也可以加入所思考问题或是解决方案的链接地址。
不推荐
一些注释工具可以帮助你写出更好的注释。JSDoc 或 YUIDoc 就是用来写 JavaScript 注释用的。你甚至可以使用工具来为这些注释生成文档，这也是激励开发者们写注释的一个好方法，因为一旦有了这样方便的生成文档的工具，他们通常会开始花更多时间在注释细节上。
前端开发代码规范文档 第二篇
在 web 项目中，所有的文件名应该都遵循同一命名约定。以可读性而言，减号（-）是用来分隔文件名的不二之选。同时它也是常见的 URL 分隔符（. or ），所以理所当然的，减号应该也是用来分隔资源名称的好选择。
请确保文件命名总是以字母开头而不是数字。而以特殊字符开头命名的文件，一般都有特殊的含义与用处。
资源的字母名称必须全为小写，这是因为在某些对大小写字母敏感的操作系统中，当文件通过工具压缩混淆后，或者人为修改过后，大小写不同而导致引用文件不同的错误，很难被发现。
还有一些情况下，需要对文件增加前后缀或特定的扩展名（比如 ., .），抑或一串前缀（比如 ）。这种情况下，建议使用点分隔符来区分这些在文件名中带有清晰意义的元数据。
不推荐
前端开发代码规范文档 第三篇
使用 ES6 风格编码
1、定义变量使用 let ，定义常量使用 const
2、静态字符串一律使用单引号或反引号，动态字符串使用反引号
3、解构赋值
4、拷贝数组
使用扩展运算符（...）拷贝数组
5、箭头函数
需要使用函数表达式的场合，尽量用箭头函数代替。因为这样更简洁，而且绑定了 this
6、模块
如果模块只有一个输出值，就使用 export default，如果模块有多个输出值，就不使用 export default，export default 与普通的 export 不要同时使用
前端开发代码规范文档 第四篇
官方文档推荐及使用遵循规则：
PascalCase (单词首字母大写命名)是最通用的声明约定
kebab-case (短横线分隔命名) 是最通用的使用约定
组件名应该始终是多个单词的，根组件 App 除外
有意义的名词、简短、具有可读性
命名遵循 PascalCase 约定
公用组件以 Abcd (公司名缩写简称) 开头，如（AbcdDatePicker,AbcdTable）
页面内部组件以组件模块名简写为开头，Item 为结尾，如（StaffBenchToChargeItem，StaffBenchAppNotArrItem）
使用遵循 kebab-case 约定
在页面中使用组件需要前后闭合，并以短线分隔，如（，）
导入及注册组件时，遵循 PascalCase 约定
同时还需要注意：必须符合自定义元素规范: 切勿使用保留字。
为代码统一美观组件全部用kebab-case 如：car-item、product-list-item、product-detail
前端开发代码规范文档 第五篇
符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面, 代码要求简洁明了有序, 尽可能的减小服务器负载, 保证最快的解析速度.
文件规范
1、 html, css, js, images文件均归档至<系统开发规范>约定的目录中;
2、 html文件命名: 英文命名, 后缀.htm. 同时将对应界面稿放于同目录中, 若界面稿命名为中文, 请重命名与html文件同名, 以方便后端添加功能时查找对应页面;
3、 css文件命名: 英文命名, 后缀.css. 共用, 首页, 其他页面依实际模块需求命名.;
4、 Js文件命名: 英文命名, 后缀.js. 共用, 其他依实际模块需求命名.
一位好的Web前端开发工程师在知识体系上既要有广度，又要有深度，所以很多大公司即使出高薪也很难招聘到理想的前端开发工程师。那么如何系统的学**企业实用的web前端技术呢，为此建立了一个web前端的直播上课学**扣扣裙，前面数字是五一四，中间的数字是一六七，最后是六七八，将数字连接起来就是了。真正想要学**的可以进入，打酱油的就不要浪费大家的时间了。现在说的重点不在于讲解技术，而是更侧重于对技巧的讲解。技术非黑即白，只有对和错，而技巧则见仁见智。
html书写规范
1、 文档类型声明及编码: 统一为html5声明类型; 编码统一为 , 书写时利用IDE实现层次分明的缩进;
2、 非特殊情况下样式文件必须外链至...之间;非特殊情况下JavaScript文件必须外链至页面底部;
3、引入样式文件或JavaScript文件时, 须略去默认类型声明,
4、 引入JS库文件, 文件名须包含库名称及版本号及是否为压缩版, 比如; 引入插件, 文件名格式为库名称+插件名称, 比如; 5、 所有编码均遵循xhtml标准, 标签 & 属性 & 属性命名 必须由小写字母及下划线数字组成, 且所有标签必须闭合, 包括 br (), hr()等; 属性值必须用双引号包括; 6、充分利用无兼容性问题的html自身标签, 比如span, em, strong, optgroup, label,等等; 需要为html元素添加自定义属性的时候, 首先要考虑下有没有默认的已有的合适标签去设置, 如果没有, 可以使用须以"data-"为前缀来添加自定义属性，避免使用"data:"等其他命名方式;
7、语义化html, 如 标题根据重要性用h*(同一页面只能有一个h1), 段落标记用p, 列表用ul, 内联元素中不可嵌套块级元素;
8、尽可能减少div嵌套, 如 欢迎访问XXX, 您的用户名是 用户名 完全可以用以下代码替代: 欢迎访问XXX, 您的用户名是用户名;
9、书写链接地址时, 必须避免重定向，例如：href="", 即须在URL地址后面加上“/”；
10、在页面中尽量避免使用style属性,即style="…";
11、必须为含有描述性表单元素(input, textarea)添加label, 如 姓名: 须写成: 姓名:
12、能以背景形式呈现的图片, 尽量写入css样式中;
13、重要图片必须加上alt属性; 给重要的元素和截断的元素加上title;
14、给区块代码及重要功能(比如循环)加上注释, 方便后台添加功能;
15、特殊符号使用: 尽可能使用代码替代: 比如 <(<) & >(>) & 空格( ) & »(») 等等;
16、书写页面过程中, 请考虑向后扩展性;
17、class & id 参见 css书写规范.
css书写规范
1、编码统一为utf-8;
2、协作开发及分工: i会根据各个模块, 同时根据页面相似程序, 事先写**体框架文件, 分配给前端人员实现内部结构&表现&行为; 共用css文件由i书写, 协作开发过程中, 每个页面请务必都要引入, 此文件包含reset及头部底部样式, 此文件不可随意修改;
3、class与id的使用: id是唯一的并是父级的, class是可以重复的并是子级的, 所以id仅使用在大的模块上, class可用在重复使用率高及子级中; id原则上都是由我分发框架文件时命名的, 为JavaScript预留钩子的除外;
4、为JavaScript预留钩子的命名, 请以 js_ 起始, 比如: js_hide, jsshow;
5、class与id命名: 大的框架命名比如header/footer/wrapper/left/right之类的在2中由i统一命名.其他样式名称由 小写英文 & 数字 & 来组合命名, 如i_comment, fontred, width200; 避免使用中文拼音, 尽量使用简易的单词组合; 总之, 命名要语义化, 简明化
. 6、规避class与id命名(此条重要, 若有不明白请及时与i沟通): a） 通过从属写法规避, 示例见d; b）取父级元素id/class命名部分命名, 示例见d; c）重复使用率高的命名, 请以自己代号加下划线起始, 比如i_clear; d）a,b两条, 适用于在2中已建好框架的页面, 如, 要在2中已建好框架的页面代码 中加入新的div元素, 按a命名法则:..., 样式写法: #mainnav .firstnav{.......} 按b命名法则:..., 样式写法: .main_firstnav{.......}
7、css属性书写顺序, 建议遵循: 布局定位属性-->自身属性-->文本属性-->其他属性. 此条可根据自身**惯书写, 但尽量保证同类属性写在一起. 属性列举: 布局定位属性主要包括: display & list-style & position（相应的 top,right,bottom,left） ＆ float & clear ＆ visibility ＆ overflow； 自身属性主要包括: width & height & margin & padding & border & background; 文本属性主要包括：color & font & text-decoration & text-align & vertical-align & white- space & 其他 & content; 我所列出的这些属性只是最常用到的, 并不代表全部;
8、书写代码前, 考虑并提高样式重复使用率;
9、充分利用html自身属性及样式继承原理减少代码量, 比如: 这儿是标题列表2010-09- 15 定义 li{position:relative} li span{position:absolute; right:0} 即可实现日期居右显示
10、样式表中中文字体名, 请务必转码成unicode码, 以避免编码错误时乱码;
11、背景图片请尽可能使用sprite技术, 减小http请求, 考虑到多人协作开发, sprite按模块制作;
12、使用table标签时(尽量避免使用table标签), 请不要用width/ height/cellspacing/cellpadding等table属性直接定义表现, 应尽可能的利用table自身私有属性分离结构与表现 , 如thead,tr,th,td,tbody,tfoot,colgroup,scope; (cellspaing及cellpadding的css控制方法:table{border:0;margin:0;border-collapse:collapse;} table th, table td{padding:0;}, 文件中我会初始化表格样式)
13、杜绝使用 兼容 ie8;
14、用png图片做图片时, 要求图片格式为png-8格式,若png-8实在影响图片质量或其中有半透明效果, 请为ie6单独定义背景: _background:none;_filter:progid: (sizingMethod=crop, src=’img/’);
15、 避免兼容性属性的使用, 比如text-shadow || css3的相关属性;
16、减少使用影响性能的属性, 比如position:absolute || float ;
17、必须为大区块样式添加注释, 小区块适量注释;
18、代码缩进与格式: 建议单行书写, 可根据自身**惯, 后期优化i会统一处理;
JavaScript书写规范
- 上一篇：银行求职自荐信范文(精选5篇)
- 下一篇：商务英语邮件格式范文(精选11篇)
最新范文：
- 药品集中采购分析报告范文(精选9篇)
- 采购补充合同范本(精选5篇)
- 租办公楼合同范本(精选14篇)
- 英语作文范文中考翻译(精选5篇)
- 地面工作计划22篇
- 环保部工作计划(精选17篇)
- 团委个人工作总结7篇
- 早教合同范本(精选8篇)
- 销售承包合同范本(精选15篇)
- 普通话工作总结22篇