现在写代码比以前好多了。代码的格式由eslint、prettier、babel（写新语法）来保证。对我自己和我的同事来说是可以理解的），因为这个问题只能由人自己解决。我们写代码的时候应该写到下图左边，这样功德基本就齐了。1.变量相关（1）变量个数的定义NO:Bususingthevariableletkpi=4;//定义后从未使用过functionexample(){vara=1;varb=2;varc=a+b;vard=c+1;vare=d+a;return;}YES：如果数据只用过一次或者不用，不用放到变量里letkpi=4;//把没用的删掉，不然三个月后就不敢用了Delete，怕是用了functionexample(){vara=1;varb=2;return2a+b+1;}(2)变量名NO:缩写感觉不错letfName='jackie';//貌似命名挺规范的，用了缩写和驼峰法，测试规范的ESlint工具都通过了，但是，fName是什么？这个时候，你要不要说你在干什么？letlName='willen';//这道题和上面的YES一样：不用给每个变量写注释，从名字就可以理解了letfirstName='jackie';//怎么样，是不是很清楚一眼。少喷一次letlastName='willen';```(3)SpecificvariableNO:unexplainedparameterif(value.length<8){//为什么小于8，8是什么意思？长度，或位移，或高度？Oh,myGod!....}YES:AddvariableconstMAX_INPUT_LENGTH=8;if(value.lengthMIN_NAME_LENGTH){//这样你就成功地在你的代码中埋了一个坑，你有没有考虑过如果fullName=['jackie']这样的情况？这样程序一运行就炸了。或者你试试。....}YES：对于评价变量，做好底线。constMIN_NAME_LENGTH=8;letlastName=fullName[1]||'';//搞好，从fullName[1]获取不到的时候，不要赋undefined，至少有个空字符，基本上，lastName的变量类型还是String，可以使用String原型链上的特性，不会报错。不会变成undefined。if(lastName.length>MIN_NAME_LENGTH){....}其实项目中有很多评价变量，需要对每一个评价变量都做一个很好的解释。letpropertyValue=Object.attr||0;//因为Object.attr可能为空，所以需要覆盖。但是，分配变量不需要覆盖底线。leta=2;//因为有底，所以不要绕过去。letmyName='Tiny';//因为有底，所以不要绕。2.函数相关(1)函数命名NO：从命名上无法知道返回值类型或真或假。你能回答吗？如果你能回答，我请你吃松鹤楼的满族宴，请不要当真。是：对于返回true或false的函数，***以should/is/can/hasfunctionshouldShowFriendsList(){...}functionisEmpty(){...}functioncanCreateDocuments(){...}functionhasLicense(){开头...}(2)函数式函数绝对是纯函数NO：不要让函数式函数的输出飘忽不定。functionplusAbc(a,b,c){//这个函数的输出会不稳定，因为一旦api返回的值发生变化，函数的a、b、c的值也会被输入，但是函数返回的结果不一定相同。varc=fetch('../api');return+b+c;}YES：函数函数使用纯函数，输入一致，输出结果始终唯一functionplusAbc(a,b,c){//同一个输入函数的a，b和c的值，但是函数返回的结果总是一样的。returna+b+c;}(3)函数传参NO:传参不解释page.getSVG(api,true,false);//true和false是什么意思？({imageApi:api,includePageBackground:true,//一目了然，知道这些真假是什么意思compress:false,})(4)动作函数必须以动词开头NO:无法区分函数意图functionemlU(user){....}YES：动词开头，函数的意图很明显functionsendEmailToUser(user){...}(5)一个函数完成一个独立的函数，不要将多个函数混用一个函数这是软件工程中最重要的函数通常，当函数需要做更多的事情时，它们就更难编写、测试、理解和组合。当您可以隔离一个功能以仅执行一个操作时，它们将更容易重构，您的代码也将更易于阅读。如果你严格遵守这条规则，你将领先于许多开发人员。NO：功能混乱，一个功能包含多个功能。***就像能打百分百的高手，被乱拳打死（乱拳（复杂函数）杀了高手（老程序员））functionsendEmailToClients(clients){clients.forEach(client=>{constclientRecord=database.lookup(client)if(clientRecord.isActive()){email(client)}})}YES:函数拆解，functionsendEmailToActiveClients(clients){//每次打断，便于维护和复用clients.filter(isActiveClient).forEach(email)}functionisActiveClient(client){constclientRecord=database.lookup(client)returnclientRecord.isActive()}(6)先使用命令式编程NO：使用for循环编程for(i=1;i<=10;i++){//A[i]=a[i]+1;}YES:使用命令式编程letb=a.map(item=>++item)//怎么样，是不是很容易理解，只需将a的值加一并将其分配给b。现在javascript中几乎所有的for循环都可以用命令式编译来代替，比如map、filter、find、some、any、forEach等。(7)ifelse..No在函数中使用过多：ifelse过多if(a===1){...}elseif(a===2){...}elseif(a===3){...}else{...}是：您可以使用switch代替或数组代替switch(a){case1:....case2:....case3:....默认：。...}Orlethandler={1:()=>{....},2:()=>{....}.3:()=>{....},默认:()=>{....}}handler[a]()||handler['default']()3.尽量使用ES6，有条件的话ES7中的新语法（只列出最常用的新语法，说实话，有些新语法不是很常用）（1）尽量使用箭头函数NO：使用传统函数functionfoo(){//code}YES：使用箭头函数letfoo=()=>{//code}(2)拼接字符串NO：使用传统的+号varmessage='Hello'+name+',it's'+time+'now'YES：使用模板字符varmessage=`Hello${name},it's${time}now`(3)UsedestructuringassignmentNO:Usetraditionalassignment:vardata={name:'dys',age:1};varname=data.name;varage=data.age;varfullName=['jackie','willen'];varfirstName=全名[0];varlastName=fullName[1];YES:使用结构赋值：constdata={name:'dys',age:1};const{name,age}=data;//怎么样，是不是简单明了varfullName=['jackie','威伦'];const[名字，姓氏]=全名；(4)尽量使用classclassNO：使用传统的函数原型链来实现继承典型的ES5class(function)在继承、构造和方法定义方面可读性差，当需要继承时，优先选择class。省略了太多代码。YES：使用ES6类实现继承=furColor}liveBirth(){/*...*/}}classHumanextendsMammal{constructor(age,furColor,languageSpoken){super(age,furColor)this.languageSpoken=languageSpoken}speak(){/*...*/}}这是首先要写的，这是目前发现的问题，本文并没有完全涵盖写代码的常见坏习惯，所以如果你觉得需要补充，可以在文章下方评论，或者直接去我的Github评论这篇文章。对于有用的，我会添加到我的掘金和Github中。同时，如果您觉得文章写得不错，请在我的Github中送上您宝贵的Star。你的Star是我继续写文章最好的动力。注意：除了上面提到的人为习惯，前面提到过，对于机械的，可以使用Babel、Eslint、Prettier等工具来保证代码的格式一致。
