如何在JavaScript中创建二维数组?

How can I create a two dimensional array in JavaScript?

我一直在网上阅读,有些地方说是不可能的,有些地方说是,然后举个例子,还有一些地方反驳这个例子,等等。

  • 如何在javascript中声明二维数组?(假设可能)

  • 我如何访问它的成员?(myArray[0][1]myArray[0,1])


  • 1
    2
    3
    4
    5
    6
    7
    var items = [
      [1, 2],
      [3, 4],
      [5, 6]
    ];
    console.log(items[0][0]); // 1
    console.log(items);


    只需将数组中的每个项设置为一个数组。

    2


    与Activa的答案类似,这里有一个创建n维数组的函数:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    function createArray(length) {
        var arr = new Array(length || 0),
            i = length;

        if (arguments.length > 1) {
            var args = Array.prototype.slice.call(arguments, 1);
            while(i--) arr[length-1 - i] = createArray.apply(this, args);
        }

        return arr;
    }

    createArray();     // [] or new Array()

    createArray(2);    // new Array(2)

    createArray(3, 2); // [new Array(2),
                       //  new Array(2),
                       //  new Array(2)]


    JavaScript只有一维数组,但是您可以构建数组数组,正如其他人指出的那样。

    以下函数可用于构建固定维度的二维数组:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    function Create2DArray(rows) {
      var arr = [];

      for (var i=0;i<rows;i++) {
         arr[i] = [];
      }

      return arr;
    }

    列数实际上并不重要,因为在使用数组之前不需要指定数组的大小。

    然后你可以打电话给:

    1
    2
    3
    4
    5
    var arr = Create2DArray(100);

    arr[50][2] = 5;
    arr[70][5] = 7454;
    // ...


    最简单的方法:

    1
    var myArray = [[]];


    有人说这是不可能的,因为二维数组实际上只是一个数组。这里的其他注释提供了在JavaScript中创建二维数组的完全有效的方法,但最纯粹的观点是您拥有一个一维对象数组,每个对象都是由两个元素组成的一维数组。

    所以,这就是观点冲突的原因。


    如何创建空的二维数组(一行)

    1
    Array.from(Array(2), () => new Array(4))

    2和4分别是第一和第二维度。

    我们正在使用Array.from,它可以为每个元素取一个类似于param的数组和一个可选的映射。

    0

    1
    2
    3
    var arr = Array.from(Array(2), () => new Array(4));
    arr[0][0] = 'foo';
    console.info(arr);

    同样的技巧也可以用来创建一个包含1…n的javascript数组。

    或者(但使用n = 10,000时效率更低12%)

    1
    Array(2).fill(null).map(() => Array(4))

    性能下降的原因是我们必须将第一个维度值初始化为运行.map。记住,在您通过.fill或直接价值分配命令之前,Array不会分配头寸。

    1
    2
    3
    var arr = Array(2).fill(null).map(() => Array(4));
    arr[0][0] = 'foo';
    console.info(arr);

    跟进

    这是一个看起来正确但有问题的方法。

    1
     Array(2).fill(Array(4)); // BAD! Rows are copied by reference

    虽然它确实返回了明显需要的二维数组([ [ <4 empty items> ], [ <4 empty items> ] ]),但有一个要点:第一个维度数组是通过引用复制的。这意味着一个arr[0][0] = 'foo'实际上会改变两行而不是一行。

    1
    2
    3
    4
    var arr = Array(2).fill(Array(4));
    arr[0][0] = 'foo';
    console.info(arr);
    console.info(arr[0][0], arr[1][0]);


    很少有人使用推送:为了带来一些新的东西,我将向您展示如何用一些值初始化矩阵,例如:0或空字符串"。提醒您,如果您有一个10元素数组,在javascript中,最后一个索引将是9!

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    function matrix( rows, cols, defaultValue){

      var arr = [];

      // Creates all lines:
      for(var i=0; i < rows; i++){

          // Creates an empty line
          arr.push([]);

          // Adds cols to the empty line:
          arr[i].push( new Array(cols));

          for(var j=0; j < cols; j++){
            // Initializes:
            arr[i][j] = defaultValue;
          }
      }

    return arr;
    }

    使用实例:

    1
    2
    x = matrix( 2 , 3,''); // 2 lines, 3 cols filled with empty string
    y = matrix( 10, 5, 0);// 10 lines, 5 cols filled with 0

    两个班轮:

    1
    2
    var a = [];
    while(a.push([]) < 10);

    它将生成一个长度为10的数组A,其中填充了数组。(push向数组中添加元素并返回新的长度)


    最理智的答案似乎是

    1
    2
    3
    4
    5
    6
    var nrows = ~~(Math.random() * 10);
    var ncols = ~~(Math.random() * 10);
    console.log(`rows:${nrows}`);
    console.log(`cols:${ncols}`);
    var matrix = new Array(nrows).fill(0).map(row => new Array(ncols).fill(0));
    console.log(matrix);

    注意,我们不能直接用行填充,因为fill使用浅复制构造函数,因此所有行都将共享相同的内存……下面是示例,演示如何共享每一行(取自其他答案):

    1
    2
    3
    4
    // DON'T do this: each row in arr, is shared
    var arr = Array(2).fill(Array(4));
    arr[0][0] = 'foo'; // also modifies arr[1][0]
    console.info(arr);


    这就是我所取得的成就:

    1
    2
    3
    4
    5
    var appVar = [[]];
    appVar[0][4] ="bineesh";
    appVar[0][5] ="kumar";
    console.log(appVar[0][4] + appVar[0][5]);
    console.log(appVar);

    这让我着迷。


    最简单的方法:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    var arr  = [];

    var arr1 = ['00','01'];
    var arr2 = ['10','11'];
    var arr3 = ['20','21'];

    arr.push(arr1);
    arr.push(arr2);
    arr.push(arr3);

    alert(arr[0][1]); // '01'
    alert(arr[1][1]); // '11'
    alert(arr[2][0]); // '20'

    二维数组的创建方式与一维数组的创建方式相同。你可以像访问array[0][1]一样访问它们。

    1
    2
    3
    var arr = [1, 2, [3, 4], 5];

    alert (arr[2][1]); //alerts"4"

    我不确定是否有人回答过这个问题,但我发现这个对我很有用-

    1
    var array = [[,],[,]]

    如:

    1
    var a = [[1,2],[3,4]]

    例如,对于二维数组。


    要在javascript中创建一个二维数组,我们可以先创建一个数组,然后添加数组作为元素。此方法将返回具有给定行数和列数的二维数组。

    1
    2
    3
    4
    5
    6
    7
    function Create2DArray(rows,columns) {
       var x = new Array(rows);
       for (var i = 0; i < rows; i++) {
           x[i] = new Array(columns);
       }
       return x;
    }

    要创建数组,请使用以下方法。

    1
    var array = Create2DArray(10,20);


    要创建一个非稀疏"2d"数组(x,y),所有索引都可寻址,并且值设置为空:

    1
    let 2Darray = new Array(x).fill(null).map(item =>(new Array(y).fill(null)))

    附加"3D"阵列(X、Y、Z)

    1
    let 3Darray = new Array(x).fill(null).map(item=>(new Array(y).fill(null)).map(item=>Array(z).fill(null)))

    在评论中和对这个问题的不同回答中都提到了这方面的变化和修正,但并不是作为一个实际答案,所以我在这里添加它。

    应该注意的是(类似于大多数其他答案),这有O(x*y)时间复杂性,因此它可能不适用于非常大的阵列。


    使用数组理解

    在javascript 1.7及更高版本中,可以使用数组理解创建二维数组。您还可以在填充数组时过滤和/或操作条目,而不必使用循环。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    var rows = [1, 2, 3];
    var cols = ["a","b","c","d"];

    var grid = [ for (r of rows) [ for (c of cols) r+c ] ];

    /*
             grid = [
                ["1a","1b","1c","1d"],
                ["2a","2b","2c","2d"],
                ["3a","3b","3c","3d"]
             ]
    */

    您可以创建所需的任何n x m数组,并通过调用

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var default = 0;  // your 2d array will be filled with this value
    var n_dim = 2;
    var m_dim = 7;

    var arr = [ for (n of Array(n_dim)) [ for (m of Array(m_dim) default ]]
    /*
             arr = [
                [0, 0, 0, 0, 0, 0, 0],
                [0, 0, 0, 0, 0, 0, 0],
             ]
    */

    这里可以找到更多的例子和文档。

    请注意,这还不是标准功能。


    我的方法与@bineesh answer非常相似,但使用的是更一般的方法。

    您可以按如下方式声明双数组:

    1
    var myDoubleArray = [[]];

    以及以以下方式存储和访问内容:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    var testArray1 = [9,8]
    var testArray2 = [3,5,7,9,10]
    var testArray3 = {"test":123}
    var index = 0;

    myDoubleArray[index++] = testArray1;
    myDoubleArray[index++] = testArray2;
    myDoubleArray[index++] = testArray3;

    console.log(myDoubleArray[0],myDoubleArray[1][3], myDoubleArray[2]['test'],)

    这将打印预期输出

    1
    [ 9, 8 ] 9 123

    用于一个线性情人数组。从()。

    1
    2
    // creates 8x8 array filed with"0"    
    const arr2d = Array.from({ length: 8 }, () => Array.from({ length: 8 }, () =>"0"));

    另一个(来自dmitry_romanov的注释)使用array().fill()。

    1
    2
    // creates 8x8 array filed with"0"    
    const arr2d = Array(8).fill(0).map(() => Array(8).fill("0"));


    我发现下面是最简单的方法:

    1
    2
    3
    4
    5
    6
    var array1 = [[]];  
    array1[0][100] = 5;

    alert(array1[0][100]);
    alert(array1.length);
    alert(array1[0].length);

    这是我找到的制作二维数组的快速方法。

    1
    2
    3
    function createArray(x, y) {
        return Array.apply(null, Array(x)).map(e => Array(y));
    }

    您也可以轻松地将此函数转换为ES5函数。

    1
    2
    3
    4
    5
    function createArray(x, y) {
        return Array.apply(null, Array(x)).map(function(e) {
            return Array(y);
        });
    }

    为什么这样做:new Array(n)构造函数创建一个原型为Array.prototype的对象,然后分配该对象的length以生成一个不受欢迎的数组。由于缺少实际成员,我们无法对其运行Array.prototype.map函数。

    但是,当您向构造函数提供多个参数时,例如在执行Array(1, 2, 3, 4)时,构造函数将使用arguments对象来正确地实例化和填充Array对象。

    因此,我们可以使用Array.apply(null, Array(x)),因为apply函数会将参数分散到构造函数中。澄清一下,做Array.apply(null, Array(3))等于做Array(null, null, null)

    现在我们已经创建了一个实际填充的数组,我们需要做的就是调用map和创建第二层(y)。


    我必须制作一个灵活的数组函数,根据需要向其中添加"记录",并且能够在将其发送到数据库进行进一步处理之前更新它们并进行所需的任何计算。这是代码,希望有帮助:)。

    1
    2
    3
    4
    5
    6
    function Add2List(clmn1, clmn2, clmn3) {
        aColumns.push(clmn1,clmn2,clmn3); // Creates array with"record"
        aLine.splice(aPos, 0,aColumns);  // Inserts new"record" at position aPos in main array
        aColumns = [];    // Resets temporary array
        aPos++ // Increments position not to overlap previous"records"
    }

    请随意优化和/或指出任何错误:)


    在1下面,创建一个5x5矩阵,并用null填充它们。

    1
    2
    3
    4
    5
    6
    var md = [];
    for(var i=0; i<5; i++) {
        md.push(new Array(5).fill(null));
    }

    console.log(md);


    javascript不支持二维数组,相反,我们将一个数组存储在另一个数组中,并根据您要访问的数组的位置从该数组中获取数据。记住数组的计数从零开始。

    代码示例:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    /* Two dimensional array that's 5 x 5

           C0 C1 C2 C3 C4
        R0[1][1][1][1][1]
        R1[1][1][1][1][1]
        R2[1][1][1][1][1]
        R3[1][1][1][1][1]
        R4[1][1][1][1][1]
    */


    var row0 = [1,1,1,1,1],
        row1 = [1,1,1,1,1],
        row2 = [1,1,1,1,1],
        row3 = [1,1,1,1,1],
        row4 = [1,1,1,1,1];

    var table = [row0,row1,row2,row3,row4];
    console.log(table[0][0]); // Get the first item in the array


    您可以分配一个行数组,其中每一行都是相同长度的数组。或者,可以使用rows*columns元素分配一维数组,并定义将行/列坐标映射到元素索引的方法。

    无论选择哪种实现,如果将其包装在对象中,就可以在原型中定义访问器方法,以使API易于使用。


    我发现这个代码对我有用:

    1
    2
    3
    4
    5
    6
    7
    var map = [
        []
    ];

    mapWidth = 50;
    mapHeight = 50;
    fillEmptyMap(map, mapWidth, mapHeight);

    1
    2
    3
    4
    5
    6
    7
    8
    9
    function fillEmptyMap(array, width, height) {
        for (var x = 0; x < width; x++) {
            array[x] = [];
            for (var y = 0; y < height; y++) {

                array[x][y] = [0];
            }
        }
    }

    一个衬板,用于创建填充0的M*N二维数组。

    1
    new Array(m).fill(new Array(n).fill(0));


    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    var playList = [
      ['I Did It My Way', 'Frank Sinatra'],
      ['Respect', 'Aretha Franklin'],
      ['Imagine', 'John Lennon'],
      ['Born to Run', 'Bruce Springsteen'],
      ['Louie Louie', 'The Kingsmen'],
      ['Maybellene', 'Chuck Berry']
    ];

    function print(message) {
      document.write(message);
    }

    function printSongs( songs ) {
      var listHTML = '';
      for ( var i = 0; i < songs.length; i += 1) {
        listHTML += '
    <li>
    '
    + songs[i][0] + ' by ' + songs[i][1] + '
    </li>
    '
    ;
      }
      listHTML += '';
      print(listHTML);
    }

    printSongs(playList);


    一个简单的例子:

    1
    2
    3
    4
    5
    var blocks = [];

    blocks[0] = [];

    blocks[0][0] = 7;

    我修改了MatthewCrumley创建多维数组函数的答案。我已经添加了要作为数组变量传递的数组的维度,还有另一个变量-value,它将用于设置多维数组中最后一个数组元素的值。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    /*
    *   Function to create an n-dimensional array
    *
    *   @param array dimensions
    *   @param any type value
    *
    *   @return array array
     */

    function createArray(dimensions, value) {
        // Create new array
        var array = new Array(dimensions[0] || 0);
        var i = dimensions[0];

        // If dimensions array's length is bigger than 1
        // we start creating arrays in the array elements with recursions
        // to achieve multidimensional array
        if (dimensions.length > 1) {
            // Remove the first value from the array
            var args = Array.prototype.slice.call(dimensions, 1);
            // For each index in the created array create a new array with recursion
            while(i--) {
                array[dimensions[0]-1 - i] = createArray(args, value);
            }
        // If there is only one element left in the dimensions array
        // assign value to each of the new array's elements if value is set as param
        } else {
            if (typeof value !== 'undefined') {
                while(i--) {
                    array[dimensions[0]-1 - i] = value;
                }
            }
        }

        return array;
    }

    createArray([]);              // [] or new Array()

    createArray([2], 'empty');    // ['empty', 'empty']

    createArray([3, 2], 0);       // [[0, 0],
                                  //  [0, 0],
                                  //  [0, 0]]

    您还可以创建一个函数来创建这样的二维数组:

    2

    您可以使用以下方法调用它,这将为您提供一个10x10二维数组。

    1
    createArray(10);

    也可以使用此方法创建三维阵列。


    还有另一种解决方案,它不强制您预先定义二维数组的大小,而且非常简洁。

    2

    这是因为,[1,2]被转换为字符串,用作table对象的字符串键。


    创建多维数组的递归函数:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    var makeArray = function (dims, arr) {          
        if (dims[1] === undefined) {
            return new Array(dims[0]);
        }

        arr = new Array(dims[0]);

        for (var i=0; i<dims[0]; i++) {
            arr[i] = new Array(dims[1]);
            arr[i] = makeArray(dims.slice(1), arr[i]);
        }

        return arr;
    }

    构建一个2x3x4x2 4d阵列:

    1
    var array = makeArray([2, 3, 4, 2]);

    如果你在搜索谷歌图表的二维数组,最好的方法是

    1
    2
    var finalData = [];
    [["key",value], ["2013-8-5", 13.5], ["2013-7-29",19.7]...]

    提到不是有效的二维数组google图表


    1
    2
    3
    4
    5
    6
    7
    8
    var _field = (function()
    {
        var array = [];
        for(var y = 0; y != 3; y++) { array[y] = new Array(5); }
        return array;
    })();

    // var item = _field[2][4];

    如果数组的大小未知,会发生什么?或者应该动态地创建和填充数组?对于我来说,另一个可行的解决方案是将类与静态二维数组变量一起使用,如果数组中不存在索引,则会启动该类:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    function _a(x,y,val){
        // return depending on parameters
        switch(arguments.length){
            case 0: return _a.a;
            case 1: return _a.a[x];
            case 2: return _a.a[x][y];
        }

        // declare array if wasn't declared yet
        if(typeof _a.a[x] == 'undefined')
            _a.a[x] = [];

        _a.a[x][y] = val;
    }
    // declare static empty variable
    _a.a = [];

    语法为:

    1
    2
    3
    4
    5
    _a(1,1,2); // populates [1][1] with value 2
    _a(1,1);   // 2 or alternative syntax _a.a[1][1]
    _a(1);     // [undefined × 1, 2]
    _a.a;      // [undefined × 1, Array[2]]
    _a.a.length

    这里有一个很棒的存储库。

    • API:masfufa.js标准

    • 示例:masfufa.html

    两个例子足以理解这个库:

    例1:

    1
    2
    3
    4
    5
    6
    7
    8
    9
       /*     | 1 , 2 , 3 |
        * MX= | 4 , 5 , 6 |     Dimensions= 3 x 3
        *     | 7 , 8 , 9 |
        */



      jsdk.getAPI('my');
      var A=[1, 2, 3, 4, 5, 6, 7, 8, 9];
      var MX=myAPI.getInstance('masfufa',{data:A,dim:'3x3'});

    然后:

    1
    2
    MX.get[0][0]  // -> 1 (first)
    MX.get[2][2] //  ->9 (last)

    例2:

    1
    2
    3
    4
    5
    6
    7
       /*      | 1 , 9 , 3 , 4 |
        * MXB= | 4 , 5 , 6 , 2 |     Dimensions= 2 x 4
        *  
        */


      var B=[1 , 9 , 3 , 4 , 4 , 5 , 6 , 2];
      var MXB=myAPI.getInstance('masfufa',{data:B,dim:'2x4'});

    然后:

    1
    2
    3
    MXB.get[0][0]  // -> 1 (first)
    MXB.get[1][3] //  -> 2 (last)
    MXB.get[1][2] //  -> 6 (before last)

    Nodejs+Lodash版本:

    1
    2
    3
    4
    var _ = require("lodash");
    var result = _.chunk(['a', 'b', 'c', 'd', 'e', 'f'], 2);
    console.log(result);
    console.log(result[2][0]);

    输出:

    1
    2
    [ [ 'a', 'b' ], [ 'c', 'd' ], [ 'e', 'f' ] ]
    e

    这在一些注释中提到,但是使用array.fill()将有助于构造二维数组:

    1
    2
    3
    4
    5
    6
    7
    function create2dArr(x,y) {
        var arr = [];
        for(var i = 0; i < y; i++) {
            arr.push(Array(x).fill(0));
        }
        return arr;
    }

    这将在返回的数组中产生一个长度为x,y倍的数组。


    这是我对多维数组的实现。

    在这种方法中,我正在创建一个一维数组

    我在Array对象中添加了一个原型函数multi,可以用来创建任何维数组。

    我还添加了一个原型函数indexArray对象中,它可以用来从多维索引中获取线性数组中的索引。

    创建数组

    1
    2
    //Equivalent to arr[I][J][K]..[] in C
    var arr = new Array().multi(I,J,K,..);

    在任何索引处访问数组值

    1
    2
    //Equivalent in C arr[i][j][k];
    var vaue = arr[arr.index(i,j,k)];

    片断

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    /*
       Storing array as single dimension
       and access using Array.index(i,j,k,...)
    */



    Array.prototype.multi = function(){
     this.multi_size = arguments;
     this.multi_len = 1
     for(key in arguments) this.multi_len *=  arguments[key];
     for(var i=0;i<this.multi_len;i++) this.push(0);
     return this;
    }

    Array.prototype.index = function(){
       var _size = this.multi_len;
       var temp = 1;
       var index = 0;
       for(key in arguments) {
          temp*=this.multi_size[key];
          index+=(arguments[key]*(_size/temp))
       }
       return index;
    }

    // Now you can use the multi dimension array
    // A 3x3 2D Matrix

    var arr2d = new Array().multi(3,3); // A 2D Array
    arr2d[arr2d.index(1,1,1)]  = 5;
    console.log(arr2d[arr2d.index(1,1,1)]);

    // A 3x3x3 3D Matrix

    var arr3d = new Array().multi(3,3,3); // a 3D Array
    arr3d[arr3d.index(1,1,1)]  = 5;
    console.log(arr3d[arr3d.index(1,1,1)]);

    // A 4x3x3 4D Matrix
    var arr4d = new Array().multi(4,3,3,3); // a 4D Array
    arr4d[arr4d.index(4,0,0,1)]  = 5;
    console.log(arr4d[arr4d.index(4,0,0,1)]);


    如果你只想要一个4x4矩阵,看看dommatrix,我可以说很容易使用,

    1
    2
    let m = new DOMMatrix();
    // m.m11, m.m12, m.m13, m.m14, ..., m.m41, m.m42, m.m43, m.m44

    最初,由于不同的原因,它在node.js上不可用,仅限于4x4。

    此外,您还可以考虑使用自动激活对象代替JS的数组,在这里查看我的答案,但在这里也带来了更多说服力:

    1
    2
    3
    4
    5
    var tree = () => new Proxy({}, { get: (target, name) => name in target ? target[name] : target[name] = tree() });

    var t = tree();
    t[0][2][3] = 4;
    console.log(t[0][2][3]);

    它使用新的JS,当您迭代它时,它的行为不正确,所以要小心使用它。

    如果您需要一个灵活的多维数组生成器,也可以看看这个。