码迷,mamicode.com
首页 > 编程语言 > 详细

实现把多维数组转为一维数组的几种方式

时间:2020-09-17 21:01:40      阅读:41      评论:0      收藏:0      [点我收藏+]

标签:避免   spl   split   方法   Nid   bsp   ==   prototype   ===   

在开发过程中遇到一个比较ip大小的情况,并且遇到了把二维数组转为一维数组的情况,翻下资料,做下总结。

方法一:转字符串法

该例子中,tempArr是一个多维数组,使用join将其转为字符串,在使用split方法转换为一维数组。

缺点: 如果数组中的各个项是number,将不可避免的转为字符串。

技术图片
    /** 
     * 使用转字符串法
     */
    let tempArr = [1,[2,3],[4,5,[6,7]]];
    let result_str1 = tempArr.join(‘,‘).split(‘,‘);
    console.log(result_str1); //  ["1", "2", "3", "4", "5", "6", "7"]
技术图片

改进:

使用了map进行再次遍历。

这种情况只适用于数组中各个项都是number类型或string类型的情况

技术图片
    // 可以使用循环改进
    function unid(arr){
        let result_str1 = arr.join(‘,‘).split(‘,‘);
        let result_number = result_str1.map(item=>{
            return Number(item);
        });
        return result_number;
    }
    console.log(unid(tempArr)); // [1, 2, 3, 4, 5, 6, 7]
技术图片

 

方法二:使用数组的concat方法,以及apply 

 

我们知道concat方法参数如果是一个数组,会把一个一维数组转为单个的项和前面的数组链接起来,如果是多维数组,则保留多维数组里面的项。

看下面这个小例子:

技术图片
    // 数组的concat方法
  
  let tempArr2 = [‘3‘,4],
  tempArr3 = [‘3‘,4,[5,6]];
  console.log([1,2].concat(tempArr2)); // [1, 2, "3", 4]
  console.log([1,2,].concat(tempArr3)); // [1, 2, "3", 4, [5,6]]
技术图片

 

所以使用concat方法只能把二维数组转为一维数组

    let tempArr4 = [[1,2],‘3‘,‘4‘,[5,6],[7]];
    console.log([].concat.apply([],tempArr4)); // [1, 2, "3", "4", 5, 6, 7]

 

方法三:使用递归

 

可以使用Object.prototype.toString.call()来判断array的类型,也可以使用Array.isArray来判断。

技术图片
    // 方法三:使用递归来实现多维数组转为一维数组
    let result = [],
        tempArr5 = [‘1‘,2,[3,4,[5,6]],7];
    function unid1(arr){
        for(let item of arr){
            if(Object.prototype.toString.call(item).slice(8, -1)===‘Array‘){
                unid1(item);
            }else{
                result.push(item);
            }
        }
        return result;
    }
    console.log(unid1(tempArr5)); // ["1", 2, 3, 4, 5, 6, 7]
技术图片

 

 

三种方法有好有坏,还是需要根据实习情况来按需使用。

实现把多维数组转为一维数组的几种方式

标签:避免   spl   split   方法   Nid   bsp   ==   prototype   ===   

原文地址:https://www.cnblogs.com/zzsdream/p/13647004.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!