js操作数组常用的方法

在前端开发中，操作数组是常见的操作。这里列举下在开发中常用的一些方法。

正文开始

concat拼接数组

        const arr1=[1,2,3];
        const arr2=['q','w','e']
        const arr3=arr1.concat(arr2);
        console.log('arr3',arr3);  
        // 打印结果 [1,2,3,'q','w','e']

join数组转成字符串

       //这里使用上面声明的arr3
        const infostring=arr3.join(',');
        console.log('infostring',infostring);

split字符串转数组

        //这里使用上面声明的infostring
        const arr4=infostring.split(',');
        console.log('arr4',arr4);  

concat，join，split打印结果

map遍历 

个人感觉map是一个非常好用且实用的一个方法，map遍历后会生成一个新数组。

        // 声明一个数组对象
        const list=[
            {id:1,name:'张三'},
            {id:2,name:'里斯'},
            {id:3,name:'王五'},
        ]
        //获取数组对象中，所有的name组成一个新的数组
        const maplist=list.map(item=> item.name);
        //获取数组对象中，所有的id组成一个新的数组
        const maplist2=list.map(item=>item.id);   
        const maplist3=list.map(item=>{
          return{
            ...item,
            age:'19',  //给每一项添加一个属性
            name:'zs'  //修改name的值,如不修改则默认还是旧值
          }
        })
        console.log('list',list);
        console.log('maplist',maplist);
        console.log('maplist2',maplist2);
        console.log('maplist3',maplist3);

打印结果

reduce求和

         const list2=[10,20,50,100];
         const reduceList= list2.reduce((ac,cu)=>{
            return ac+cu;
         })
        //  reduce 支持传入初始值
         const reduceList2= list2.reduce((ac,cu)=>{
            return ac+cu;
         },1000)
         console.log('reduceList',reduceList);
         console.log('reduceList2',reduceList2);

打印结果

 reverse反转，filter过滤，sort排序

         const list3=[1,2,3,4,5];
         list3.reverse();
         console.log('list3',list3);

         const filterList=list3.filter(x=>x>3);
         console.log('filterList',filterList);

      
        const sortList=['ccc','www','aaa','eee','bbb'];
        sortList.sort();
        console.log('sortList',sortList);
        const list4=[3,8,2,12,1];
        list4.sort((a,b)=>a-b);
        console.log('list4',list4);

需要注意点，sort方法直接调用针对于字符串可以实现排序，针对于数字需要传入函数。

打印结果

flat展开数组 

当数组里面嵌套有数组，需要把二级数组展开且添加到一级数组里面可以使用flat

        const fltalist=[1,2,[3],[4,[5]]];
        var fltalist2=fltalist.flat(1);
        console.log('fltalist展开1级',fltalist2);
        var fltalist3=fltalist.flat(2);
        console.log('fltalist展开2级',fltalist3);

打印结果

end

本文列举了在开发中常用的操作数组的方法。对于push，pop，splice等过于基础的方法就略过了。补充一点关于对数组的深拷贝和浅拷贝也是在开发中常用的，对于深拷贝和浅拷贝不清楚的可以看下这里 深拷贝和浅拷贝（如有误欢迎指正）