一些有意思的es写法分享 点击小卡片参与粉丝专属福利轻松一些、分享一些有意思的写法,权当放松了 ?发现身边事儿、聊点周奇遇，我是沈二，期待奇遇的互联网灵魂~、一起聊天吹水，探索新的可能~wx:「breathingss」，入圈吧！ ?Map字典?? 在项目过程中,你可能会妥协各式各样的风格,会有要求所有用到字典都配置化的、当然也会有通用码表自己维护的,分享一些公共码表的维护写法，貌似第二种变异写法更适合一些。 /** *计划周期PLAN_LEVEL */ exportconstPLAN_LEVEL=newMap(); PLAN_LEVEL.set('1','月度') PLAN_LEVEL.set('2','季度') PLAN_LEVEL.set('3','年度') //变异写法 exportconstAPP_TYPE=newMap([ ['APP','应用'], ['LINK','链接'], ['COM','组件'] ]); 去重Set?? 自从有了es6,去重似乎变得简单起来 constunique=(arr)=Array.from(newSet(arr)) unique([1,2,3,6,6,7]) (5)[1,2,3,6,7] 当然解构的写法更简单，而且Array.from有更有意思的写法 constunique=(arr)=[...newSet(arr)] unique([1,2,3,6,6,7]) (5)[1,2,3,6,7] Array.from 构造数据构造指定长度的数组Array.from({length:1000}) 填充指定格式的模拟数据//用10填充数据 Array.from({length:1000}).fill(10) (1000)[10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,…] //函数处理，序号填充 Array.from({length:1000},(v,i)=i) (1000)[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,…] 解构...??解构的写法带来了诸多便利，这里分享两个有意思的处理 「例1（除某参数外的剩余参数）」：如组件封装的分页参数和服务端接收的参数不匹配，重新进行填充 varobj={page:1,size:10,name:"测试",type:1} const{page,size,...other}=obj other {name:'测试',type:1} varnewParam={...other,pageNo:page,pageSize:size} newParam {name:'测试',type:1,pageNo:1,pageSize:10} 「例2（定长数组解构）」const[name,id]="测试_01".split('_') console.log(name,id) VM813:1测试01 接口的分文件名对象合并??许多的业务接口文件定义了之后，需要一个index.js去合并多个接口对象块,用来注入到全局，以Vue为例子,避免每次都去引用 集成部分/* *接口集成 */ constrequireAPIS=require.context('./modules',false,/\.js$/) constapis= requireAPIS.keys().forEach((key)={ letmodule=requireAPIS(key); if(module){ constname=key.replace(/(\.\/|\.js)/g,''); apis[name]=module; } }); exportdefaultapis; 注册部分Vue.prototype.$api=apis; 应用部分asynconSave(){ //数据保存 constresp=awaitthis.$api.user.saveConfig({}) } 树结构转换函数transformTozTreeFormat(sNodes,{key,parentKey,childKey}){ vari,l, key=key||'id', parentKey=parentKey||'pId', childKey=childKey||'children'; if(!key||key==""||!sNodes)return if(Object.prototype.toString.apply(sNodes)==="[objectArray]"){ varr= vartmpMap= for(i=0,l=sNodes.length;ii++){ //如果原本带有子节点，移除 if(sNodes[i][childKey]){ deletesNodes[i][childKey]; } tmpMap[sNodes[i][key]]=sNodes[i]; } for(i=0,l=sNodes.length;ii++){ if(tmpMap[sNodes[i][parentKey]]sNodes[i][key]!=sNodes[i][parentKey]){ if(!tmpMap[sNodes[i][parentKey]][childKey]) tmpMap[sNodes[i][parentKey]][childKey]= tmpMap[sNodes[i][parentKey]][childKey].push(sNodes[i]); }else{ r.push(sNodes[i]); } } return }else{ return[sNodes]; } } 调用vardt=transformTozTreeFormat(res,{key:"id",parentKey:"parentId" 附录??跳出疯狂的忙碌??别把执着用错地方，两种思维的碰撞??透过线上问题谈横向能力??我有一刀，可斩全栈??35岁鞋不合脚的问题??所谓核心竞争力 如果文章对你有帮助的话欢迎「关注+点赞+收藏」 阅读原文