JS前端开发规范

向右看齐 2023-07-16 07:59 3阅读 0赞

# 前端开发规范 #

## 插件开发规范 ##

### 总则 ###

开发js插件，需要尽量减少对其他库的依赖，尽量使用js原生语法。  
必须编写插件的开发使用文档以及插件使用的demo。

### 命名规则 ###

#### 项目命名 ####

使用全小写方式，多个单词使用减号“-”分割。  
示例：csui-list （译为：川顺科技列表插件项目）

#### 目录命名 ####

使用全小写方式，多个单词使用减号“-”分割（尽量使用单个词语）；  
名词有复数结构时，未使用缩写时要采用复数命名法。  
示例：

*  images（缩写：img；译为：图片存放文目录）
 *  scripts（缩写：js；译为：脚本存放目录）
 *  styles（缩写：css；译为：样式存放目录）

#### 文件命名 ####

使用全小写命名，多个单词使用减号“-”分割；文件属性使用英文句号“.”分割。  
示例：echarts-all.min.js（译为：echartst图表完整版压缩包/库）。  
常用文件属性约定：

*  min 压缩

#### html元素自定义属性命名 ####

使用小驼峰命名法，遵循html5自定义属性命名规范，使用data-前缀。  
示例：

*  data-code(译为：元素内容对应的code编码值)

#### 函数命名 ####

使用小驼峰命名法，前缀应为动词。  
示例：常用动词约定：getName（译为：获取姓名）。  
常用动词约定：

*  get 获取
 *  set 设置
 *  load 加载
 *  is 判断

#### 变量命名 ####

使用小驼峰命名法，尽量在变量名中体现属性。  
示例：tableTitle（译为：表格标题）。

#### 常量命名 ####

使用全大写，多个单词使用下划线“\_”分割。  
示例：

*  COORDS\_TYPE（译为：地理坐标类型）。

#### 类/构造函数命名 ####

使用大驼峰命名法。  
公共属性和方法：跟变量和函数的命名一样。  
私有属性和方法：前缀为下划线“\_”，后面跟公共属性和方法一样的命名方式。  
示例：

class UserInfo{
    	private _name:string;
    		getName(){
    		return this.name;
    	};
    };

## 注释规范 ##

### 总则 ###

代码中的每个函数和关键业务逻辑都需要添加注释说明。

### 行内注释 ###

行内注释以两个斜线“//”开始，以行尾结束。一般用来对单个变量进或调用方法行说明。  
示例：

page.init();  // 页面初始化
    var userName =””;  // 用户姓名，初始为空

### 单行注释 ###

单行注释以两个斜线“//”开始，以行尾结束。一般用来对接下来的业务做一个说明或代码单行过长是使用。  
示例：

// 获取参数并进行合法性验证
    var userName = document.getElementById(“name”).value();
    var userAge = document.getElementById(“age”).value();
    var isLegal = app.userInfoLeagal(userName,userAge);

### 多行注释 ###

以 “/*” 开头，由“*/”结尾。一般用来对函数进行说明。  
常用注释名约定：

*  @author 作者信息说明  
    语法：@ author作者信息 \[附属信息：如邮箱、日期\]
 *  @param 传入参数说明  
    语法：@param \{类型\} 参数名描述信息
 *  @return 返回参数说明  
    语法：@ return \{类型\} 参数名描述信息  
    示例：

/**
     * 获取用户信息
     * @author 杨小辉 [991865986@qq.com 2010-01-01]
     * @param {string} code 传入用户编码
     * @return {user} user返回用户对象
     */
    function getUserInfo (code){
    	var user = { };
    	retrun user;
    };

发表评论取消回复

表情：

评论列表（有 0 条评论，3人围观）

还没有评论，来说两句吧...

相关阅读

相关 JS前端开发规范

前端开发规范插件开发规范总则开发js插件，需要尽量减少对其他库的依赖，尽量使用js原生语法。必须编写插件的开发使用文档以及插件使用的demo。

向右看齐/ 2023年07月16日 07:59/ 0 赞/ 4 阅读

相关前端开发规范【范本】

概述为提高团队协作效率，规范文件管理，方便项目后期维护，提高代码质量，特制订此文档，前端开发人员必须遵照本规范进行前台页面开发。一、目录规范 1. 页面存放

Myth丶恋晨/ 2023年01月09日 12:57/ 0 赞/ 192 阅读

相关前端开发规范详解

引言如果开发团队就一个人的话，那么自己写的代码就是规范，随着公司业务的扩展，团队不断壮大，这时候就要开始考虑协作和编码规范问题了。 > 一个人走的更快，一群人可以走的

拼搏现实的明天。/ 2023年01月09日 12:57/ 0 赞/ 170 阅读

相关 Vue前端开发规范

基于Vue官方风格指南整理一、强制 1. 组件名为多个单词 > 组件名应该始终是多个单词的，根组件 App 除外。正例： export d

比眉伴天荒/ 2022年12月29日 14:05/ 0 赞/ 151 阅读

相关前端开发规范参考

前言：前端开发规范参考分享前端开发规范参考一、规范目的二、通用规范三、框架开发规范 1、项目使用框架 2、学习资料

秒速五厘米/ 2022年09月13日 04:14/ 0 赞/ 354 阅读

相关前端开发规范

https://guide.aotu.io/ 京东 http://tgideas.qq.com/doc/index.html 腾讯 https://g

蔚落/ 2022年09月04日 00:49/ 0 赞/ 273 阅读

相关前端开发规范

目录前端代码规范一．编程规约 (一) 命名规范 1.1.1 项目命名

小鱼儿/ 2022年09月03日 04:29/ 0 赞/ 486 阅读

相关前端开发规范总结

1、前端开发规范 WEB客户端开发自成体系，主要用于智能终端（iPhone、Android手机、iPad、Android Pad）和传统PC的开发。JS规范、HTML规

旧城等待，/ 2022年07月12日 13:14/ 0 赞/ 305 阅读

相关前端开发命名规范

https://blog.51cto.com/13507333/2052369 变量名：字母数字下划线和$符号组成，不能由数字开头；不能和系统关键词重名转载于:https

末蓝、/ 2021年12月24日 07:03/ 0 赞/ 362 阅读

相关前端开发规范：4-JS

ESLint 使用ESLint的standard规范来编写js代码更多参考： [https://github.com/standard/standard/blob/ma

男娘i/ 2021年10月23日 14:24/ 0 赞/ 246 阅读