分享平时开发中经常出现的提高代码质量的十个小点：记得处理错误，尤其是在网络请求或其他异步操作中，await记得包装trycatch，可以给用户一个友好的提醒，同时可以考虑catch中需要做什么，必要时上传日志。尝试{this.loading=this.$loading({lock:true,text:'Loading...',spinner:'el-icon-loading',background:'rgba(0,0,0,0.7)',});constinfo=awaitresDistributeService({taskTicketId:this.id});...}catch(e){this.$message({type:'error',message:e.msg||e.message||'failure',});}最后{this.loading.close();}可以结合finally来处理加载等，数字0的校验前端经常使用!v来判断v是否有值。if(!v){return}doSomething()但如果0是v的有效值，此时应该处理，但提前结束，最终抛出错误。这个时候需要显示的判断是null还是undefined。if(v===null||v===undefined){return}doSomething()函数返回默认对象由于js中对象是引用，所以赋默认值时最好使用函数,并在每次新对象时返回一个。bad:constdefaultCondition={name:'',conditionList:[{conditionCode:'',conditionValue:null,},],}exportdefault{data(){return{condition:{...defaultCondition},};},方法:{closeDialog(){this.condition={...defaultCondition};this.configId=null;这个.$refs.form.resetFields();},},};good:constgetDefaultCondition=()=>({name:'',conditionList:[{conditionCode:'',conditionValue:null,},],})exportdefault{data(){return{条件：getDefaultCondition(),};},方法:{closeDialog(){this.condition=getDefaultCondition();this.configId=null;这个.$refs.form.resetFields();},},};接口地址单独存放，接口的定义放在一个统一的文件中，以后改改起来会更方便，但是如果所有的url都硬编码在页面中，会很麻烦。//service.jsimport来自'utils/request'的请求；constservice=new(request('/api/m/mallorder/exp/compensation/customer'))();exportconstlistService=(params)=>{returnservice.post('/queryRuleList',params);};exportconstlistDataKey='ruleVOList';exportconstidKey='ruleId';exportconstdialogEnumService=()=>{returnservice.get('/info');};exportconstsaveService=(params)=>{returnservice.post('/saveRule',params);};exportconstdetailService=(params)=>{returnservice.get('/detail',params);};另外，网络请求一般都是在npm包的基础上进行打包的。一方面可以注入通用参数，另一方面可以对返回的数据进行统一的错误处理。多参数函数使用对象如果定义一个函数需要3个以上的参数function(a,b,c,d){}这时候可以考虑使用对象解构，改成function({a=1,b,c,d}={}){}的好处是以后需要扩展参数的时候，不用太担心其他地方调用时传递参数会不会出问题。当然，如果参数过多，还需要思考当前函数是否承载了过多的功能，进行功能拆分。函数单一职责当我们定义了一个函数时，例如初始化一些变量。functioninitOptions(){a=xxxb=xxx}这时候我们需要做另外一件不相关的事情[A]。虽然和initOptions是同时调用的，但是最好不要直接放在initOptions中，而是新建一个函数单独调用。否则，如果以后需要在其他地方调整initOptions，而此时可能不需要做[A]，就会造成bug。参数合法性判断由于js语言的灵活性，函数传入的参数可能不符合预期。必要时，我们需要进行底线判断和处理，不能完全信任来电者。在团队合作中，这个函数以后很可能会被其他人调用。函数doSomeThing(params1,params2){if(params1===null){返回；}if(params2){...}//再做我们的事情}如果后面的过程强依赖params，我们可以直接Return，必要时上报日志或抛出Error。整数处理js中没有整数类型，即java中的int和long。所有数字都遵循IEEE754标准，即java中的double。具体可以参考浮点数详解。能准确表示的最大整数是9007199254740991，共16位。如果数字超过此数字，精度可能会丢失。对于新接口，可以向后端询问相应数字字段的最大值是多少。对于浮点数的处理，除了众所周知的0.1+0.2===0.3为假外，我们在对数字进行运算时也需要注意。9.04元到904分的普通换算：我们需要对结果进行四舍五入。OptionalChainingOptionalchainingoperator，参考MDN，用的比较多。对于后端指定的数组或对象，有时后端可能会返回null甚至没有字段，因此前端可以对数组、对象、函数使用可选的链运算符，防止错误直接阻塞后续进程。让nestedProp=obj.first?.second;//相当于obj.first&&obj.fisrt.second//后面的过程但是不要过度使用optionalchain，如果有些地方没有问题，比如lettest=obj.first?.second,ifsecond必须可用，我们可以直接让test=obj.first.second。不然以后如果这里出了问题，obj.first为null，但是我们用的是optionalchain，所以obj.first?.second不会报错，永远不知道这里出了问题.当然也需要权衡一下，不加可选链导致的jsError会不会影响业务逻辑。在修改对象或数组引用或使用对象或数组时，永远记住它们是引用，一处修改会导致处处修改。
