本文已获得原作者ivan授权翻译。在我多年的编程生涯中,我一直在优先考虑我写代码的方式,不仅是为了让它更简洁,还因为它有助于提高编码效率,让写代码更快。写1000行代码和写300行代码不一样,这对我们正在做的程序或脚本帮助很大。编程时必须非常小心,因为脏代码在大型项目中可能是一个严重的问题。许多程序员批评JS语言没有像Java或C++那样的标准工作方式,但事实是JavaScript是当今使用的最好的语言之一,其中一些是Facebook和Netflix。像React这样的库可以提高前端性能,而对于后端,nextJs可以提高速度,这种组合让今天的程序员抓狂。**ECMAScriptv6(缩写为ES6或ES2015)**是2015年6月以来遵循的标准JavaScript。通过学习以下技术,我们可以改进我们编写代码的方式。花时间在控制台上练习,学好。让我们开始吧~1.常量使用const代替var常量是永远不会改变的变量,所以这样声明变量可以保证它们永远不会改变。/*旧方法*/vari=1;/*正确方法*/consti=1;2。使用let而不是varlet语句来声明具有块作用域的局部作用域变量/*Inappropriate*/varmyVal=1;for(vari;i<10;i++){myVal=1+i;}/*正确方法*/letmyVal=1;for(leti;i<10;i++){myVal+=i}3.DeclarationObjectdeclaresobjectwithshortcut/*oldmethodTheObject()classmakesanunnecessaryfunctioncall*/constmyObject=newObject();/*正确方法*/constmyObject={};5.连接字符串/*旧方法*/constmyStringToAdd="world";constmyString="hello"+myStringToAdd;/*正确方法*/constmyStringToAdd="world";constmyString=`hello${myStringToAdd}`;6.使用对象方法简写/*不合适*/constcustomObject={val:1,addVal:function(){returncustomObject.val+1;}}/*正确方式*/constcustomObject={val:1,addVal(){returncustomObject.val++}}**粗体文字**7。创建对象值/*旧方法*/constvalue=1;constmyObject={value:value}/*正确方式*/constvalue=1;constmyObject={value}8.给对象赋值/*旧方法*/constobject1={val:1,b:2};letobject2={d:3,z:4};object2.val=object1.val;object2.b=object1.b;/*正确方式*/constobject1={val:1,b:2};constobject2={...object1,d:3,z:4}9.数组赋值/*不合适*/constmyArray=[];myArray[myArray.length]="helloworld";/*正确方式*/constmyArray=[];myArray.push('Helloworld');10.连接数组/*不合适*/constarray1=[1,2,3,4];constarray2=[5,6,7,8];constarray3=array1.concat(array2);/*正确方式*/constarray1=[1,2,3,4];constarray2=[5,6,7,8];constarray3=[...array1,...array2]11.获取一个对象的多个属性/*不合适*/functiongetFullName(client){return`${client.name}${client.last_name}`;}/*正确方式*/functiongetFullName({name,last_name}){return`${name}${last_name}`;}12.获取值来自object/*inappropriate*/constobject1={a:1,b:2};const=object1.a;constb=object1.b;/*正确方式*/constobject1={a:1,b:2};const{a,b}=object1;13.创建函数/*老方法,但是很好*/functionmyFunc(){}/*很好*/constmyFunc=function(){}/*更好*/constmyFunct=()=>{}//重要提示:在一些建议不要使用这些函数的情况与箭头一起使用以避免读取错误14。默认/*不适当*/constmyFunct=(a,b)=>{if(!a)a=1;if(!b)b=1;return{a,b};}/*正确方式*/constmyFunct=(a=1,b=1)=>{return{a,b};}15.使用reduce代替forEach和for求和/*不合适*/constvalues=[1,2,3,4,5];lettotal=0;values.forEach((n)=>{total+=n})/*不合适*/constvalues=[1,2,3,4,5];lettotal=0;for(leti;i<值.length;i++){total+=values[i];}/*正确方式*/constvalues=[1,2,3,4,5];consttotal=values.reduce((total,num)=>total+num);16.数组中是否存在/*不合适*/constmyArray=[{a:1},{a:2},{a:3}];letexist=false;myArray.forEach(item=>{if(item.a===2)exist=true})/*正确的方式*/constmyArray=[{a:1},{a:2},{a:3}];constexist=myArray.some(item=>item.a==2)17.shortcutforboolean/*不合适的*/consta=5;letb;if(a===5){b=3;}else{b=2;}/*正确的方法*/consta=5;constb=a===5?3:2;总结和复习这篇文章,实践和学习如何更干净地工作,提高处理速度完成~,我是小智,我去洗碗了,下次见!作者:ivan.c译者:前端小智来源:medium原文:https://medium.com/javascript-in-english/18-tips-for-writing-javascript-code-like-a-hero-17ca1dc49da9本文转载自微信公众号“大招天下”,可通过以下二维码关注。转载本文请联系大千世界公众号。
