1的10个必须知道的JavaScript技巧。使用“reduce”作为加法器和累加器，我们可以轻松实现多个数相加或累加的功能。//adderconstsum=(...nums)=>{returnnums.reduce((sum,num)=>sum+num);};安慰。日志（总和（1、2、3、4、10））；//20//accumulatorconstaccumulator=(...nums)=>{returnnums.reduce((acc,num)=>acc*num);};console.log(累加器(1,2,3));//62.计算数组的最大值和最小值有多少种方法可以得到数组的最大值或最小值？1):使用Math.max和Math.min我们不得不承认使用MathAPI是最简单的方法。常量数组=[-1,10,6,5];constmax=Math.max(...数组);//10constmin=Math.min(...array);//-12):使用reduction是的，我们只需要一行代码就可以达到和Math的API一样的效果。常量数组=[-1,10,6,5];constmax=array.reduce((max,num)=>(max>num?max:num));constmin=array.reduce((min,num)=>(min{constsearch=window.location.search;让查询={}；搜索.slice(1).split("&").forEach((it)=>{const[key,value]=it.split("=");query[key]=decodeURIComponent(value);});返回查询；}；2）、使用reduceReduce其实可以做到这一点，而且看起来更简单。constparseQuery=()=>{constsearch=window.location.search;返回搜索.replace(/(^\?)|(&$)/g,"").split("&").reduce((query,it)=>{const[key,value]=it.split("=");query[key]=decodeURIComponent(value);返回查询;},{});};它是如何工作的？/urlhttps://qianlongo.github.io/vue-demos/dist/index.html?name=fatfish&age=100#/home//1.首先获取搜索参数constsearch=window.location.search;//？name=fatfish&age=100//2.去掉开头的“？”orending"&".search.replace(/(^\?)|(&$)/g,"");//?name=fatfish&age=100=>name=fatfish&age=100//3.使用reduce来collectparameters//...4.反序列化搜索参数当我们想跳转到某个链接并为其添加一些搜索参数时，手动拼接的方式不是很方便。如果有很多参数要串联，那将是一场灾难。constsearchObj={name:"fatfish",age:100,//...};constlink=`https://medium.com/?name=${searchObj.name}&age=${searchObj.age}`;//https://medium.com/?name=fatfish&age=100还好，"reduce”可以帮助我们轻松解决这个问题。conststringifySearch=(search={})=>{returnObject.entries(search).reduce((t,v)=>`${t}${v[0]}=${encodeURIComponent(v[1])}&`,Object.keys(search).length?"?":"").replace(/&$/,"");};constsearch=stringifySearch({name:"fatfish",age:100,});constlink=`https://medium.com/${search}`;控制台日志（链接）；//https://medium.com/?name=fatfish&age=1005,flattenmultiplelayersNestedarrays你知道如何展平多层嵌套数组吗？constarray=[1,[2,[3,[4,[5]]]]];//预期输出[1,2,3,4,5]constflatArray=array.平坦（无穷大）；//[1,2,3,4,5]"flat"是一个非常强大的API。使用reduce实现和flat一样的功能。constflat=(array)=>{返回数组。reduce((acc,it)=>acc.concat(Array.isArray(it)?flat(it):it),[]);};常量数组=[1,[2,[3,[4,[5]]]]];constflatArray=flat(数组);//[1,2,3,4,5]6、模拟平面特征的功能虽然我们已经实现了对深度嵌套数组进行展平的功能，但是如何才能完全实现展平的功能呢？//默认展开一层Array.prototype.flat2=function(n=1){constlen=this.lengthletcount=0letcurrent=thisif(!len||n===0){returncurrent}//确认当前是否有数组项consthasArray=()=>current.some((it)=>Array.isArray(it))//每次循环展开一层while(count++{result=result.concat(it)returnresult},[])}returncurrent}constarray=[1,[2,[3,[4,[5]]]]]//展开一层console.log(array.flat())//[1,2,[3,[4,[5]]]]console.log(array.flat2())//[1,2,[3,[4,[5]]]]//展开allconsole.log(array.flat(Infinity))console.log(array.flat2(Infinity))7.保持数组的唯一性，reduce也容易保持数组的唯一性constarray=[1,2,1,2,-1,10,11]constuniqueArray1=[...newSet(array)]constuniqueArray2=array.reduce((acc,it)=>acc.includes(it)?acc:[...acc,it],[])8.统计数组成员的个数如何计算数组中每个成员的个数？为什么使用地图而不是对象？constcount=(array)=>{returnarray.reduce((acc,it)=>(acc.set(it,(acc.get(it)||0)+1),acc),newMap())}constarray=[1,2,1,2,-1,0,'0',10,'10']console.log(count(array))9.获取一个对象的多个属性朋友们，我们拿看看你在工作中会遇到的场景。//有一个对象有很多属性constobj={a:1,b:2,c:3,d:4,e:5//...}//我们只想得到它上面的一些属性createanewobjectconstnewObj={a:obj.a,b:obj.b,c:obj.c,d:obj.d//...}//是不是觉得这样效率太低了？使用reduce来解决constgetObjectKeys=(obj={},keys=[])=>{returnObject.keys(obj).reduce((acc,key)=>(keys.includes(key)&&(acc[key]=obj[key]),acc),{});}constobj={a:1,b:2,c:3,d:4,e:5//...}constnewObj=getObjectKeys(obj,['a','b','c','d'])console.log(newObj)10,reversestringconstreverseString=(string)=>{returnstring.split("").reduceRight((acc,s)=>acc+s)}conststring='fatfish'console.log(reverseString(string))//hsiftaf总结了以上今天分享给大家的关于Reduce的10个JavaScript技巧，如果你发现了有用，请点赞，关注我，分享给你的朋友，说不定能帮到他。最后，感谢阅读，祝编程愉快！
