【无标题】

前端开发基本规范

##javaScript文件

JavaScript程序应独立保存在后缀名为js的文件中，应避免在HTML中编写JavaScript代码， 因存在与HTML中的JavaScript代码会明显增加文件大小，且不能对其进行缓存和压缩。filename.js或JavaScript的代码应尽量放到body的后面，这样可以减少因为载入题本而造成其他。

##缩进
缩进使用Tab键来缩进。因为使用Vscode编码统一的Tab长短标准，缩进格式做到一致。

##长度
避免每行超过100个字符，当一条语句一行写不下时，考虑折行

##变量命名
当命名变量时，开发过程中约定为驼峰式命名 (constiableName)

##数值操作处理
###四舍五入
在JavaScript 中，对数值进行四含五入操作的场景有以下几种：

• 向上取整：ceil 表示在一个教值之上，且距离该数最近的整教。ceil 是Math 对条的静态方法，需要传递一个参数，其调用方法如下：

Math.ceil(12.34); // 13
Math.ceil(12.68); // 13

• 向下取整：floor 表示在一个数值之下，且距离该数最近的整数。floor 是 Math 对急的静态方法，需要传递一个参数，其调用方法如下：

Math. floor(12.34); // 12
Math. floor(12.34); // 12

• 固定长度：toPrecision toPrecison 也是Number 原型上实现的一个处理浮点数的方法，和toFixed 不同的是，它是对一个浮点教进行四舍五入并保留固定长度的有效数字，包括整数部分。
  99.456001. toPrecision(5);// 99.456 100.456001.toPrecision(5); // 100.46
• 四舍五入：round round 的作用是对一个浮点数进行四舍五入，并保留整数位。round 是Math 对象的静态方法，也需要传递一个参数，其调用方法如下：

Math.round(12.34); // 12
Math.round(12.54); // 13

• 固定精度：toFixed toFixed 和上面三个方法不同，已是 Number 原型上实现的一个方法，其作用是对一个浮点数进行四舍五入并保留固定小数位。toFixed 需要传連一个参数，其调用方式如下：

188.456001.toFixed(2); // 100.46
180.456001.toFixed(3); // 100.456

关子toFixed 和round两种方法的注京事项：

toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。例如格数据Num保留2位小数，则表示为：
toFixed(Num)：但是其四含五入的规则与数学中的规则不同，使用的是银行家会入规则，银行家含入;所调银行家含入法，其实质是一种四舍六入五取偶 （又称四合六入五留双）法。
具体规则如下：简单来说就是：四含六入五考虑，五后非要就进一，五后为要看奇偶，五前为偶应会去，五前为奇要进一。
这种规则不符台我们平常在数据中处理的方式。为了解決这样的门题，可以三定义去便用Math.round方法进行自定义式的实现指定保留多少位教据进行处理。

使用round方法处理；round（）方法可把一个数子舍入为最接近的整数。例如：Math.round(x)，则是将x取其最接近的整数。其取舍的方法使用的是四舍五入中的方法，符合数学中取舍的规则。对于小数的处理没有那么便捷，但是可以根据不同的要求，进行自定义的处理。
例如：对于x进行保留两位小数的处理，则可以便用 Math.roundx*100)，100 进行处理。

/*
@param ([type]} num [符处理数字]
@param ([type]} decimal [括要保留的小数位】
@return{[type]} []
*/
function round(num, decimal) {
if (isNaN(num)){
return“参数有误”；
}
const p1 = Math.pow(19, decimal + 1);
const p2 = Math.pow(10, decimal);
return Math.round(num * p1 / 10) / p2;
console. log(round(10.11, 2)) // 10.11
console.log(round (10.16, 1)) //18.2
console. log(round (10.116, 3)) //10.116
console.log(round(10.11111, 4)) // 10.1111

数值精度问题及处理:开发过程中涉及数值计算时使Big.jsxx**处理数值操作的精度问题：

//在公共配巴中引入：
pm install big.js
import Big from 'big.js';
//开发业好代码时使用

// 加
// bad
const plusA = 0.1 + 0.2; // 0.30000060000000084
// good
const plusB = parseFloat(new Big(0.1) .plus(0.2)); //0.3

//减
// bad
const minusA = 33.01 - 5; // 28.009999999999998
// good
const minusB = parseFloat (new Big(33.01). minus(5));// 28.01

//乘
// bad
const timesA = 0.6 * 3;// 1.7999999999999998
// good
const timesB = parsefloat (new Big(0.6) .times(6));//3.6

// 除
// bad
const divA = 0.3 / 0.1；// 2.9999999999999996
// good
const divB = parseFloat(new Big(0.3).div(0.1))3；// 3

##异常处理

代码运行异常 Catch浏览器等环境的异常，抛出异常提示，终止交易

交易异常 根据业务场景以及规则，判断是否关键交易：1.关键文易：前端catch交易报错信息提示客户，并终止拦截交易；如涉及关键异常交易信息等，可转义异常提示话术，如：“系统繁忙，请
稍后再试"等。2非关键交易：根据业务场录要求，可特殊处理。如温馨提示．部分话术类场暴，catch异常不拋出，客户无感，不阻塞主流程交易：

交易异常 会直接影响/间接是提交交易参数的，或者导致客户无法下单的交易，页面初始化或接口交易异常后，捕获异常，根据业务场景转义或直接提示接口返回异常信息，指引客户跳转到对应的页面

留痕处理 针对重点业务，在昇常导致的交易拦截或必要的授权交易情况时，可进行留痕操作处理；

//1.业务场景拦截
if (inputMoney productBal){
// TODO留痕处理
return ‘错误提示’；
}
//2.接口异常场景：
try {
// TODO留痕处理
//交品处理等业务逻辑
}catch (err) {
// TODO留痕处理
alert(“温樂提示”，err)
//异常处理逻辑代码
}

##注释

• 当行注释
  一般用于简单的描述，如某些状态描述、属性猫述等 注释内容前后名一个空格字符，注释位于麦汪释代码的上面，单独占一行

<!--推荐：-->
<!-- Comment Text-->
<div>...</div>
<!--不推荐：-->
<div>...</div><!-- Comment Text-->
<div><!-- Comment Text-->
...
</div>

• 模块注释
  一般用于描述模块的名称以及模块开始与结束的位

<!--推荐写法-->
<!-- 5 Comment Text A -->
<div class="nod_a">
...
</div>

• 嵌套模块注释
  当模块注射内再出现模块注释的时候，为了突出主要模块，嵌套模块不再使用

<!--s comment Text-->
<!-- E Comment Text-->

而改用

<!-- /Comment Text -->

注释亏在模块结尾标签底部，单独一行。

<!-- 5 Comment Text A -->
<div class-"mod a">
<div class="mod b">
</div>
<!--/mod b -->
<div class="mod c">
</div>
<!-- /mod C-->
</div>
<!-- E Comment Text A-->