本文由原作者OrkhanJafarov授权翻译。1.生成一个带有随机数的列表Array.from({length:1000},Math.random)//[0.6163093133259432,0.8877401276499153,0.4094354756035987,...]-1000items2.生成一个带有数字的列表Array.from({length:1000},(v,i)=>i)//[0,1,2,3,4,5,6....999]3.RGB→转换为十六进制constrgb2hex=([r,g,b])=>`#${(1<<24)+(r<<16)+(g<<8)+b}`.toString(16).substr(1);rgb2hex([76,11,181]);//#4c0bb54。转换Hex→RGB如何转换回来?这是实现这一目标的好方法。consthex2rgb=hex=>[1,3,5].map((h)=>parseInt(hex.substring(h,h+2),16));hex2rgb("#4c0bb5");//[76,11,181]5.奇数或偶数使用位运算:constvalue=232;if(value&1)console.log("奇数");elseconsole.log("even");//even6.检查有效的URLconstisValidURL=(url)=>{try{newURL(url);returntrue;}catch(error){returnfalse;}}isValidURL('https://segmentfault.com/u/minnanitkong/articles')//trueisValidURL("https//invalidto");//false7.从过去到现在的时间表明,有时我们需要打印6分钟前的日期,但我们不想让大型库来做。这是一个小片段:constfromAgo=(date)=>{constms=Date.now()-date.getTime();constseconds=Math.round(ms/1000);constminutes=Math.round(ms/60000);consthours=Math.round(ms/3600000);constdays=Math.round(ms/86400000);constmonths=Math.round(ms/2592000000);constyears=Math.round(ms/31104000000);switch(true){caseseconds<60:return`${seconds}second(s)ago"`;caseminutes<60:return`${minutes}minute(s)ago"`;casehours<24:return`${hours}hour(s)ago"`;casedays<30:return`${days}day(s)ago`;casemonths<12:return`${months}month(s)ago`;default:return`${years}year(s)ago`;}};constcreatedAt=newDate(2021,0,5);fromAgo(createdAt);//14day(s)ago;8.使用参数生成路由我们经常处理路由/路径做一个很多工作,我们总是需要操纵它。generatePath可以在我们需要生成带参数的路径时帮助我们将浏览器推送到那里!constgeneratePath=(path,obj)=>path.replace(/(:[a-z]+)/g,(v)=>obj[v.substr(1)]);constroute="/app/:page/:id";generatePath(route,{page:"products",id:85,});///app/products/1239.从路径获取参数constgetPathParams=(path,pathMap,serializer)=>{path=path.split("/");pathMap=pathMap.split("/");returnpathMap.reduce((acc,crr,i)=>{if(crr[0]===":"){constparam=crr.substr(1);acc[param]=serializer&&serializer[param]?serializer[param](path[i]):path[i];}returnacc;},{});};getPathParams("/app/products/123","/app/:page/:id");//{page:'products',id:'123'}getPathParams("/items/2/id/8583212","/items/:category/id/:id",{category:v=>['Car','Mobile','Home'][v],id:v=>+v});//{category:'Home',id:8583212}10.使用查询字符串生成路径constgetQueryParams=url=>url.match(/([^?=&]+)(=([^&]*))/g).reduce((total,crr)=>{const[键,值]=crr.split("=");total[key]=value;returntotal;},{});getQueryParams("/user?name=Orkhan&age=30");//{name:'Orkhan',age:'30'}我是小智,我去洗碗了,下次见~作者:OrkhanJafarov译者:前端小智来源:dev-to-code-like-a-superhero-vol-2-mp6本文转载自微信公众号“大千世世”,作者大千世记转载本文,请联系大千世记公众号。
