美文网首页JavaScript 进阶营web前端开发
JavaScript数组_二维数组_三维数组(二十五)

JavaScript数组_二维数组_三维数组(二十五)

作者: 终身成长人格 | 来源:发表于2019-12-04 18:12 被阅读0次

    目录:

    1.二维数组
    2.三维数组
    3.多维数组扁平化处理

    一、二维数组

    第一种方法:通过数组表达式来创建二维数组

    var ArrayObj = [ [ 1,2 ], [ 1,2] ];
    

    第二种方法:通过构造函数来创建二维数组

    //第一种方式:传递两个Array构造函数到参数中
    var ArrayObj = new  Array(new  Array(),new  Array());
     
    //第二种方式:传递两个Array表达式到参数中
    var ArrayObj = new  Array([],[]);
     
    //第三种方式:通过for循环为其添加Array构造函数
    var ArrayObj = new Array();    //创建数组对象
    for (var i = 0; i < length; i++) {
        ArrayObj[i] = new Array();    //在每一个数组元素内再定义一个数组
    }
    

    二、三维数组

    三维数组:[[["a","b","c"],[1,2,3]],[["a","b","c"],[1,2,3]]]; //数组的每一个元素是一个二维数组。
    

    三、多维数组扁平化处理【案例】

    // 多维数组扁平化 
    var arr=[1,2,[3,4,[5,6,7]],9,[10,11]]
    
    // 1) 方法一  循环数组+递归调用
    function steamroller (arr){
      // 1.创建一个新数组,保存扁平后的数据
      var newArr=[];
      // 2.for循环原数组
      for(var i=0;i<arr.length;i++){
        if(Array.isArray(arr[i])){
          // 如果是数组,调用steamroller 将其扁平化
          // 然后在push 到newArr中
          newArr.push.apply(newArr,steamroller(arr[i]))
        }else {
          // 反之 不是数组,直接push进newArr
          newArr.push(arr[i])
        }
      }
      // 3.返回新的数组
      return newArr
    }
    console.log(steamroller(arr)) // [ 1, 2, 3, 4, 5, 6, 7, 9, 10, 11 ]
    
    // 2) 方法二  利用apply+some
    // 利用arr.some判断当数组中还有数组的话,递归调用steamroller2扁平函数(利用apply扁平), 用concat连接,最终返回arr;
    function steamroller2(arr){
      while(arr.some(item=> Array.isArray(item))){
        arr=[].concat.apply([],arr)
      }
      return arr
    }
    console.log(steamroller2(arr))
    
    // 3) 方法三   reduce方法
    // 当数组中还有数组的话,递归调用steamroller3扁平函数(利用reduce扁平), 用concat连接,最终返回arr.reduce的返回值;
    function steamroller3(arr){
      return arr.reduce((prev,next)=>{
        return prev.concat(Array.isArray(next)?steamroller3(next):next)
      },[])
    }
    console.log(steamroller3(arr))
    
    // 4) 方法四   es6 展开运算符
    // 利用arr.some判断当数组中还有数组的话,递归调用flatten扁平函数(利用es6展开运算符扁平), 用concat连接,最终返回arr;
    
    function steamroller4(arr){
      while(arr.some(item=> Array.isArray(item))){
        // arr=[].concat.apply([],arr)
        arr=[].concat(...arr)
      }
      return arr
    }
    console.log(steamroller4(arr))
    

    下节预告:数组_数组方法【一】

    参考视频教程:https://www.3mooc.com/front/couinfo/228

    相关文章

      网友评论

        本文标题:JavaScript数组_二维数组_三维数组(二十五)

        本文链接:https://www.haomeiwen.com/subject/kailgctx.html