15个简单的JS编码标准让你的代码更整洁(小结)
作者|DanielAnderson
本文最初发布于Medium网站，经原作者授权后翻译和分享。
编码标准可以帮助以下方面：
- 保持代码一致
- 易于阅读和理解
- 易于维护
下面的编码标准是我对上述几点有帮助的看法。
1.比较时使用===代替==
这很重要，因为JavaScript是一种动态语言，因此使用==可能会给您带来意想不到的结果，因为它允许类型不同。
Fail：
if(val==2)
Pass：
if(val===2)
2.永远不要使用var，使用let来代替
使用let将有助于避免JavaScript中各种var引起的作用域问题。
Fail：
varmyVar=10;
Pass：
letmyVar=10;
3.使用const代替let
这阻止了开发人员尝试更改不应该做的事情，并且确实有助于提高可读性。
Fail：
letVAT_PERCENT=20;
Pass：
constVAT_PERCENT=20;
4.始终使用分号（;）
尽管这在JavaScript中是可选的，并不像其它语言一样需要分号作为语句终止符。但是使用;有助于使代码保持一致。
Fail：
constVAT_PERCENT=20; letamount=10 returnaddVat(amount,vatPercent)
Pass：
constvatPercent=20; letamount=10; returnaddVat(amount,vatPercent);
5.JavaScript中的命名约定
- let应该使用驼峰命名。
- const如果在文件的顶部使用大写的蛇形命名法。如果不在文件顶部，请使用驼峰命名。
- class应该是帕斯卡命名法:MyClass
- functions函数应该是驼峰命名法:myFunction
6.拼接字符串时使用模板字符串
模板字符串中允许嵌入表达式。
Fail：
letfullName=firstName+""+lastName;
Pass：
letfullName=`${firstName}${lastName}`;
7.尽可能使用ES6箭头函数
箭头函数是编写函数表达式的更简洁的语法。
Fail：
varmultiply=function(a,b){
returna*b;
};
Pass：
constmultiply=(a,b)=>{returna*b};
8.始终在控制结构周围使用大括号
所有控制结构都必须使用花括号（例如，if，else，for，do，while等），这样后期维护时，不容易出错。
Fail：
if(valid) doSomething(); if(amount>100) doSomething(); elseif(amount>200) doSomethingElse();
Pass：
if(valid){
doSomething();
}
if(amount>100){
doSomething();
}
elseif(amount>200){
doSomethingElse();
}
9.确保大括号从同一行开始，中间有空格
Fail：
if(myNumber===0)
{
doSomething();
}
Pass：
if(myNumber===0){
doSomething();
}
10.尝试减少嵌套
if内的if会变得混乱并且很难阅读。有时你可能无法解决问题，但是可以好好卡看看代码结构，看看是否可以改进。
Fail：
if (myNumber > 0) {
if (myNumber > 100) {
if (!hasDiscountAlready) {
return addDiscountPercent(0);
} else {
return addDiscountPercent(10);
}
} else if (myNumber > 50) {
if (hasDiscountAlready) {
return addDiscountPercent(5);
}
} else {
if (!hasDiscountAlready) {
return addDiscountPercent(0);
} else {
return addDiscountPercent(1);
}
}
} else {
error();
}
Pass：
if (myNumber <= 0) {
return error;
}
if (!hasDiscountAlready) {
return addDiscountPercent(0);
}
if (myNumber > 100) {
return addDiscountPercent(10);
}
if (myNumber > 50) {
return addDiscountPercent(5);
}
return addDiscountPercent(1);
通过上面的示例可以看出，减少嵌套之后，会变得容易阅读。
11.尽可能使用默认参数
在JavaScript中，如果你在调用函数时没有传递参数，则它的值就是undefined
Fail：
myFunction(a,b){
returna+b;
}
Pass：
myFunction(a=0,b=0){
returna+b;
}
12.`Switch`语句应使用`break`并具有`default`
我通常会尝试不使用switch语句，但是你确实想使用它，请确保每个条件都break，并写了defalut。
Fail：
switch(myNumber)
{
case10:
addDiscountPercent(0);
case20:
addDiscountPercent(2);
case30:
addDiscountPercent(3);
}
Pass：
switch (myNumber)
{
case 10:
addDiscountPercent(0);
break;
case 20:
addDiscountPercent(2);
break;
case 30:
addDiscountPercent(3);
break;
default:
addDiscountPercent(0);
break;
}
13.不要使用通配符导入
Fail：
import*asFoofrom'./Foo';
Pass：
importFoofrom'./Foo';
14.使用布尔值的快捷方式
Fail：
if(isValid===true) if(isValid===false)
Pass：
if(isValid) if(!isValid)
15.尝试避免不必要的三元语句
Fail：
constboo=a?a:b;
Pass：
constboo=a||b;
总结
任何语言的编码标准都可以真正帮助提高应用程序的可读性和可维护性。如果你在团队中工作，那么一件很难的事情就是强制执行编码标准。这里有一些建议可以帮助你：
- 代码审查，逐行Pass代码。
- 整理或使用某种代码分析器
- 创建新内容时，让你们的一位高级开发人员初始化，其他开发人员可以使用该代码作为指导。
原文链接:https://medium.com/javascript-in-plain-english/19-simple-javascript-coding-standards-to-keep-your-code-clean-7422d6f9bc0
到此这篇关于15个简单的JS编码标准让你的代码更整洁(小结)的文章就介绍到这了,更多相关JS编码标准内容请搜索毛票票以前的文章或继续浏览下面的相关文章希望大家以后多多支持毛票票！