KingFunsion工程开发规范——JS规范

news2024/10/10 0:30:12

哈喽,大家好,我是雷工。

今天学习KingFunsion工程开发规范之JS规范。
在这里插入图片描述

第一章 统一规范

1.1. 一行代码只做一件事;

1.2. 长行拆分;

1.3. 代码块外使用try catch包裹;

1.4. 全局变量在数据词典中定义;

1.4.1. 将常量,通用字符串,在数据词典中定义;
在这里插入图片描述

1.5. 重复的逻辑需要及时封装,经常变化的逻辑需要抽象出来并封装为自定义函数;

1.6. 定时器创建完成需要有对应销毁逻辑;

1.7. 不能出现意义不明的模糊字符串,提示信息或者注释描述需要有实际意义;

第二章 JavaScript 编码规范

2.1. 结构

A缩进

2.1.1. 使用Tab缩进,每嵌套一级缩进一个Tab;

B空格

2.1.2. 二元运算符两侧必须有一个空格,一元运算符与操作对象之间不允许有空格;

2.1.3. 用作代码块起始的左花括号 { 前必须有一个空格;
在这里插入图片描述

2.1.4. if / else / for / while / function / switch / do / try / catch / finally 关键字后,必须有一个空格;

2.1.5. 在对象创建时,属性中的 : 之后必须有空格,: 之前不允许有空格;

2.1.6. 函数声明、具名函数表达式、函数调用中,函数名和 ( 之间不允许有空格;

2.1.7. , 和 ; 前不允许有空格;

2.1.8. 在函数调用、函数声明、括号表达式、属性访问、if / for / while / switch / catch 等语句中,() 和 [] 内 紧贴括号部分不允许有空格;
在这里插入图片描述

2.1.9. 单行声明的数组与对象,如果包含元素,{} 和 [] 内紧贴括号部分不允许包含空格;

2.1.10. 行尾不得有多余的空格;

C换行

2.1.11. 在函数声明、函数表达式、函数调用、对象创建、数组创建、for语句等场景中,不允许在 , 或 ; 前换行;

2.1.12. 不同行为或逻辑的语句集,使用空行隔开,更易阅读;

2.1.13. 对于 if…else… 、 try…catch…finally 等语句,推荐使用在 } 号后添加一个换行;
在这里插入图片描述

D语句

2.1.14. 不得省略语句结束的分号;

2.1.15. 在 if / else / for / do / while 语句中,即使只有一行,也不得省略块 {…};

2.1.16. 函数定义结束不允许添加分号;

2.2. 命名

(注:Pascal Case 大驼峰式命名法:所有单词的首字母大写 例如:StudentInfo、UserInfo、ProductInfo;

Camel Case 小驼峰式命名法:除第一个单词外,其他单词首字母大写 例如:studentInfo、userInfo、productInfo;)
在这里插入图片描述

2.2.1. 变量、函数名、函数参数使用Camel Case小驼峰式命名法;

2.2.2. 常量、枚举的属性名采用全部字母大写命名,单词间下划线分隔;

2.2.3. 给变量命名时,应该要使变量名具有代表意图的象征,使人易于搜索并且容易理解;

2.2.4. 不要在变量名中增加没必要额外的单词;

2.2.5. 不能用符号或者单个字母等无法理解的变量名称命名;

2.2.6. 方法的命名采用名词+动词或名词+介词+动词的组合进行描述具体是什么,干什么,怎么样;
在这里插入图片描述

2.3. 注释

2.3.1. 单行注释须独占一行,//(双斜线)后跟一个空格;

2.3.2. 多行注释使用//,避免使用多个单行注释;

2.3.3. 常量注释用 @const 标记,并包含说明和类型信息;

2.3.4. 函数/方法注释必须包含函数说明、参数及其类型说明、返回值及其类型说明;

2.3.5. 对Object 中各项的描述,必须使用 @param 标识;

2.3.6. 事件注释时需使用@event 标识,且事件参数的标识与方法的描述标识相同;
在这里插入图片描述

2.4. 语言特性

A. 变量

2.4.1. 每个 var 只能声明一个变量,建议使用let和const进行声明;

2.4.2. 变量必须即用即声明,及时删除未引用的声明;

B. 条件

2.4.3. 在判断相等时,使用类型严格的 =,判断不等使用 !

2.4.4. 尽可能使用简洁的表达式(如使用if(name)而不使用 if(name != ‘’);

2.4.5. 按执行频率排列分支的顺序;

2.4.6. 避免负面条件,如if(isNoEmpty()){};

2.4.7. 对于相同变量或表达式的多值条件,用 switch 代替 if;

2.4.8. 如果函数或全局中的 else 块后没有任何语句,可以删除 else;
在这里插入图片描述

C. 循环

2.4.9. 不要在循环体中包含函数表达式,事先将函数提取到循环体外(注:因运行过程中会生成循环次数个函数对象);

2.4.10. 对循环内多次使用的不变值,在循环外用变量缓存;

D. 类型

2.4.11. 类型检测优先使用 typeof 。对象类型检测使用 instanceof 。null 或 undefined 的检测使用 == null;

2.4.12. 转换成 string 时,使用 + ‘’ ;

2.4.13. 转换成 number 时,通常使用 + ;

2.4.14. string 转换成 number ,要转换的字符串结尾包含非数字并期望忽略时,使用 parseInt;

2.4.15. 使用 parseInt 时,必须指定进制;

2.4.16. 转换成 boolean 时,使用 !! ;

2.4.17. number 去除小数点,使用 Math.floor / Math.round / Math.ceil ,不使用 parseInt;
在这里插入图片描述

E. 字符串

2.4.18. 字符串开头和结束使用单引号 ;

2.4.19. 使用 数组 或 + 拼接字符串;

F. 函数

2.4.20. 函数功能须单一;

2.4.21. 函数尽量短小、易懂,长度尽量保持 50 行以内(特定算法等不可分割的逻辑允许例外);

2.4.22. 一个函数的参数控制 6 个以内;

2.4.23. 函数尽量设计少调用其他函数,多被其他函数调用的函数;

2.4.24. 函数避免递归调用;

2.4.25. 函数返回值时避免临时先用局部变量暂存数据再返回;

在这里插入图片描述

第三章 Html 编码规范

3.1. id 命名:单词全字母小写,单词间以下划线分隔;

3.2. 每个元素都要添加关闭标签;

3.3. 属性名须使用小写字母,属性值须用双引号包围;

3.4. 使用大写的 DOCTYPE以启用标准模式;

3.5. 页面必须使用精简形式,明确指定字符编码;

3.6. 引入 CSS 时必须指明 rel=“stylesheet”;

3.7. 页面必须包含 title 标签声明标题;
在这里插入图片描述

第四章 CSS 编码规范

4.1. 严禁使用!Important;

4.2. 选择器 与 { 之间必须包含空格;

4.3. 属性名与紧随其后的 “:”之间不许跟空格, “:”与属性值之间须跟空格;

4.4. 列表型属性值书写在单行时,“,” 后必须跟一个空格;

4.5. 多选择器时选择器声明必须独占一行;

4.6. >、+、~ 选择器的两边各保留一个空格;

在这里插入图片描述

4.7. 属性选择器中的值必须用双引号包围;

4.8. 属性定义需换行,且以分号结尾;

4.9. 选择器的嵌套层级应不大于 3 级,位置靠后的限定条件应尽可能精确;

4.10. 在可以使用缩写的情况下,尽量使用属性缩写;

4.11. 文本内容必须用双引号包围;

4.12. url() 函数中的路径不加引号且url() 函数中的绝对路径可省去协议名;

4.13. 长度为 0 时须省略单位;

4.14. RGB颜色值统一使用带有alpha的颜色信息的 rgba(),使用时每个逗号后必须保留一个空格;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/790567.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

分析业务团队如何进行技术建设

背景 大部分中大型的互联网公司,会按照一个技术团队 多个业务团队的组织形式。技术团队负责技术基础建设,而业务部门更多的聚焦在业务迭代上。 这种组织形式有其优越性: 可以避免大量重复技术建设 减少上下文,降低沟通成本 …

网络安全 Day20-计算机网络基础知识05(网络原理)

计算机网络基础知识05(网络原理) 1. OSI 模型2. VMware虚拟机NAT模式下上网原理3. 不能上网故障排查 1. OSI 模型 OSI 7层网络通信原理模型 OSI 国际网互联 OSI 数据包封装解封装过程 北京局域网主机A到深圳局域网主机B数据工作流程 2. VMware虚拟机N…

Qt+GDAL开发笔记(一):在windows系统mingw32编译GDAL库、搭建开发环境和基础Demo

若该文为原创文章,转载请注明原文出处 本文章博客地址:https://hpzwl.blog.csdn.net/article/details/131931309 红胖子网络科技博文大全:开发技术集合(包含Qt实用技术、树莓派、三维、OpenCV、OpenGL、ffmpeg、OSG、单片机、软硬…

腾讯云 Cloud Studio 实战训练营——快速构建React完成点餐H5页面

目录 ​编辑 一、前言 1、什么是腾讯云 Cloud Studio 2、本文实验介绍 二、前期准备工作 1、注册 Cloud Studio 2、初始化工作空间 三、开发一个简版的点餐系统页面 1、安装依赖 1.1、安装 antd-mobile 1.2、安装 less 和 less-loader 1.3、暴露 webpack 配置文件 …

Linux JDK 安装详解

安装JDK 1.1 下载jdk压缩包 下载地址: Java Downloads | Oracle Java Downloads | Oracle 下载完成之后上传到服务器 # 1.将JDK解压缩到指定目录 tar -zxvf jdk-8u171-linux-x64.tar.gz -C /usr/ 注意:-C参数是将JDK解压之后文件放入usr目录中 # 2.进入jdk解压缩目录…

前端Vue仿支付宝自定义可滑动轮播分页宫格菜单组件,可支持九宫格 十二宫格 十五宫格

背景介绍 随着技术的不断发展,传统的开发方式使得系统的复杂度越来越高。在传统开发过程中,一个小小的改动或者一个小功能的增加可能会导致整体逻辑的修改,造成牵一发而动全身的情况。为了解决这个问题,我们采用了组件化的开发模…

SpringBoot+Prometheus+Grafana实现系统可视化监控

场景 SpringBoot中集成Actuator实现监控系统运行状态: SpringBoot中集成Actuator实现监控系统运行状态_springboot actuator 获取系统运行时长_霸道流氓气质的博客-CSDN博客 基于以上Actuator实现系统监控,还可采用如下方案。 Prometheus Prometheu…

EC200U-CN学习(一)

EC200U系列内置丰富的网络协议,集成多个工业标准接口,并支持多种驱动和软件功能(适用于Windows 7/8/8.1/10、Linux和Android等操作系统下的USB驱动),极大地拓展了其在M2M领域的应用范围,如POS、POC、ETC、共…

PMP项目成本管理-控制成本-挣值分析

适用于控制成本过程的数据分析技术包括: 挣值分析 (EVA Earned value analysis) 挣值分析将实际进度和成本绩效与绩效测量基准进行比较。EVM(Earned value Management)把范围基准、成本基准和进度基准整合起来,形成绩效测量基准。它针对每个工作包和控制账户&…

MPAS跨尺度、可变分辨率模式

跨尺度预测模式(The Model for Prediction Across Scales - MPAS)是由洛斯阿拉莫斯实验室和美国国家大气研究中心(NCAR)共同开发,其由3个部分组成,分别称为 MPAS-A(大气模型)、MPAS-O(海洋模型&…

【LeetCode】19.删除链表的倒数第N个结点

题目 给你一个链表,删除链表的倒数第 n 个结点,并且返回链表的头结点。 示例 1: 输入:head [1,2,3,4,5], n 2 输出:[1,2,3,5]示例 2: 输入:head [1], n 1 输出:[]示例 3&…

Stable Diffusion - 扩展 SegmentAnything 和 GroundingDINO 实例分割算法 插件的配置与使用

欢迎关注我的CSDN:https://spike.blog.csdn.net/ 本文地址:https://blog.csdn.net/caroline_wendy/article/details/131918652 Paper and GitHub: Segment Anything: SAM - Segment Anything GitHub: https://github.com/facebookresearch/s…

HCIA 第二课总结

配置网络设备的明文密钥实验组网 实验拓扑 将一个路由器使用配置口进行连接 sys #进入系统视图模式 sysname RTA #给设备命名 user-interface console 0 #进入用户接口配置界面 authentication-mode password #配置认证模式为密钥认证 set authentication password ciphe…

【优选算法题练习】day8

文章目录 一、974. 和可被 K 整除的子数组1.题目简介2.解题思路3.代码4.运行结果 二、525. 连续数组1.题目简介2.解题思路3.代码4.运行结果 三、560. 和为 K 的子数组1.题目简介2.解题思路3.代码4.运行结果 总结 一、974. 和可被 K 整除的子数组 1.题目简介 974. 和可被 K 整…

Vue3+ElementPlus实际项目快速开发模板Pure Admin

发现了一个超好用的模板项目,不仅有很全面的完整版,还有精简的可以直接拿来用的后台管理框架。文档很全面,甚至有B站配套视频! PureAdmin保姆级文档 vue-pure-admin快速开发教程(使用Vue3、Vite、Element-Plus、TypeScript、Tail…

基于nodejs+vue微信小程序加油站服务管理系统

开发语言 node.js 框架:Express 前端:Vue.js 数据库:mysql 数据库工具:Navicat 开发软件:VScode 基于微信小程序加油站服务 系统分为用户和管理员两个角色 用户微信端的主要功能有: 1.用户注册和登陆小程序 2.用户…

【C#】微软的Roslyn 是个啥?

一、说明 Roslyn 是微软重写的C#编译器并开源。 Roslyn 是 C# 和 Visual Basic.NET 开源编译器的代号。以下是它如何在过去十年企业Microsoft的最黑暗中开始,并成为所有C#(和VB)的开源,跨平台,公共语言引擎&#xff0c…

LiveGBS流媒体平台GB/T28181功能-设备树自定义分组自定义组织机构选择通道共享给上级国标平台配置权限给指定用户

LiveGBS流媒体平设备树自定义分组自定义组织机构选择通道共享给上级国标平台权限给指定用户 1、背景2、分组2.1、新建分组2.2、选择通道2.3、导入设备2.4、编辑名称2.5、删除分组2.6、移除分组 3、国标级联3.1、分组共享节点3.1.1、共享给上级平台3.1.2、分配权限给用户 3.2、级…

智能制造RFID设备包括哪些?

智能制造是现代制造业的重要发展方向,其核心是数字化、网络化和智能化。而在智能制造中,RFID设备是一种不可或缺的技术手段,主要用于实现物品的识别、追踪和化管理。以下是智能制造中常用的RFID设备及其功能: 1、 RFID读写器 RFID…

环境搭建和HelloWorld

文章目录 环境搭建和HelloWorld计算机基础知识计算机诞生计算机发展历程计算机硬件计算机软件 DOS命令概述打开命令提示符窗口常用DOS命令 Java概述和环境搭建诞生和发展Java平台版本和作用Java语言特点Win64系统搭建Java8开发环境 第一行代码--HelloWorld创建Java文件编写Java…