让你的JS代码更加优雅可维护的分享，当然这些经验不一定是最佳实践。有兴趣或有不同意见的读者可以和鱼头一起讨论。拒绝魔法我们都知道魔法是这样的：哦，不。.编程世界也有魔法，一般称为：魔法数字、魔法变量、魔法字符串。例如：consta=awaitabcdefg();console.log(a===200);constb=awaitasdfgh();if(b===0){}elseif(b===1){}elseif(b===2){};for(leti=0;i<10;i++){};上面直接出现的那些莫名其妙的变量名、字符串和判断条件号，就叫做魔法。..这样写出来的代码晦涩难懂，难以维护，隐藏的bug也很多。除非你打算埋掉接班人，或者打算辞职，否则不要这样写（容易断腿，👨?🦽）那么怎么写更优雅呢？语义首先是语义。一种是变量和常量的语义，例如：constSUCCESS_STATUS=200;constrequestStatus=awaitgetStatus();console.log(requestStatus===SUCCESS_STATUS);constuserRole=awaitgetUserRole();constGUEST_CODE=0;constUSER_CODE=1;constADMIN_CODE=2;if(userRole===GUEST_CODE){}elseif(userRole===USER_CODE){}elseif(userRole===ADMIN_CODE){};constMAX_NUM=10;constMIN_NUM=0;for(letcurrentNum=MIN_NUM;currentNum
按页面组件的状态划分，实现独立自主。这样既可以防止代码耦合，方便维护和调试，也可以方便开发者自己测试。如果需要查看不同状态的显示效果，只需要手动给OrderStatus可以赋值，方便快捷。根据维基百科的解释：面向切面编程（Aspect-orientedprogramming，AOP，又译为面向切面编程、面向段编程）是计算机科学中的一种编程。其思路是进一步将横切关注点与业务主体分离，提高程序代码的模块化。估计没有人会看上面的文字。算了，还是直接上代码吧。让我们回顾一下上面打工人的场景。假设老板想知道打工人每个状态开始和结束前的时间，要做什么，那么Howtodoit？这时候我们就不难想到可以直接把代码写进state函数，例如：constworker={getup(){boss.start();worker.do();boss.end();},去上班(){boss.start();命中worker.do();boss.end();},加班(){boss.start();命中worker.do();boss.end();},早上6点下班(){boss.start();worker.do();boss.end();}};//工人。getup();//workerat9am.goto();//晚上6点打worker。Overtime();//12点打工人。下班（）;（不影响业务逻辑），那么我们就可以使用AOP实现了。代码如下：importeqfrom'lodash';constTYPES={FUNCTION:'function'}constworkerintheboss=newProxy(worker,{get(target,key,value,receiver){console.log('老大开始看你啦~');constres=Reflect.get(target,key,value,receiver);constworkertask=eq(typeofres,TYPES.FUNCTION)?res():res;console.log('The老板开始记住你了小书~');return()=>workertask;}});所以我们可以看到如下结果：这样我们就可以轻松简单地监控工人的日常工作，而不会让工人发现，资本家们听到的时候差点哭出来。
