当前位置: 首页 > Web前端 > HTML

前端面试题格式化数组

时间:2023-03-28 19:23:39 HTML

题目如下:数组[{name:'1',type:0},{name:'2',type:0},{name:'3',type:2},{name:'6',type:3},{name:'4',type:2},{name:'5',type:3}];转换为[{type:0,values:[{name:'1',type:0},{name:'2',type:0}]},{type:2,values:[{name:'3',type:2},{name:'3',type:2}]},{type:3,values:[{name:'5',type:3},{name:'6',type:3}]},]形式答案:暂时写两种:1.利用对象key的唯一性(复杂处理)constoldArray=[{name:'1',type:0},{name:'2',类型:0},{名称:'3',类型:2},{名称:'6',类型:3},{名称:'4',类型:2},{名称:'5',类型:3},];常量对象={};constprocessArr=oldArray.forEach(item=>{if(!obj[item.type]){obj[item.type]=[item];}else{obj[item.type]=obj[item.type].concat(item);这里如果是赋值形式就不要用push,会改变原来的数组。所以这里使用了concat;如果要使用push,可以直接写成:obj[item.type].push(item)}});console.log('obj>>>',obj);然后processobj得到需要什么分析:这个面试题主要是按照类型来分类的。首先,数组中的重复项必须是唯一的。想到这里,可以利用objectkey的唯一性来进行处理,而且由于目标数组的values需要将原来的类型塞进去,所以可以使用array的方式来填入对应的value对象键。最终得到处理后的对象,后续操作就简单了。2、使用Set方法去重(简单方法)constoldArray=[{name:'1',type:0},{name:'2',type:0},{name:'3',type:2},{name:'6',type:3},{name:'4',type:2},{name:'5',type:3},];consthandledArr=[...newSet(oldArray.map(item=>item.type)].map(_item=>({type:_item,values:oldArray.filter(__item=>__item===_item)}))这个方法很简洁,但是idea和上面objectkey的唯一性是一样的,首先让类型唯一,将Set引入类数组,然后根据展开运算符处理成真正的数组,再根据数组map方法处理,并转换数组的每一项,格式化为一个目标数组;对值的处理就是使用数组的filter方法对原数组进行过滤,返回我们需要的类型。总结:这道面试题涵盖了数组的各种方法:filter、concat、push、map。想了解更多数组和类数组的可以看我的另一篇文章:https://segmentfault.com/a/11...也希望更多的朋友可以留言进行技术交流,我们会共同进步!