Как создать двумерный массив в JavaScript?

Я читал в интернете, и некоторые места говорят, что это невозможно, некоторые говорят, что это, а затем дают пример, а другие опровергают пример и т. д.

  1. как объявить 2-мерный массив в JavaScript? (если это возможно)

  2. Как я могу получить доступ к его членам? (myArray[0][1] или myArray[0,1]?)

30 ответов


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

вы просто делаете каждый элемент в массиве массивом.

var x = new Array(10);

for (var i = 0; i < x.length; i++) {
  x[i] = new Array(3);
}

console.log(x);

подобно ответу activa, вот функция для создания n-мерного массива:

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 имеет только одномерные массивы, но вы можете создавать массивы массивов, как указывали другие.

для построения 2-d массива фиксированных размеров можно использовать следующую функцию:

function Create2DArray(rows) {
  var arr = [];

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

  return arr;
}

количество столбцов не очень важно, потому что не требуется указывать размер массива перед его использованием.

тогда вы можете просто позвонить:

var arr = Create2DArray(100);

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

самый простой способ:

var myArray = [[]];

некоторые говорят, что это невозможно, потому что двумерный массив на самом деле просто массив массивов. Другие комментарии здесь предоставляют совершенно правильные методы создания двумерных массивов в JavaScript, но самой чистой точкой зрения было бы то, что у вас есть одномерный массив объектов, каждый из этих объектов будет одномерным массивом, состоящим из двух элементов.

Итак, это причина конфликтующих точек зрения.


немногие люди показывают использование push:
Чтобы принести что-то новое, я покажу вам, как инициализировать матрицу с некоторым значением, например: 0 или пустой строкой "".
Напоминая, что если у вас есть массив из 10 элементов, в javascript последний индекс будет 9!

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;
}

примеры использования:

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

два вкладыша:

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

Он будет генерировать массив a длины 10, заполненные массивы. (Push добавляет элемент в массив и возвращает новую длину)


самый здравый ответ, кажется,

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 использует конструктор мелкой копии, поэтому все строки будут делиться то же самое память...вот пример, который демонстрирует, как каждая строка будет ОБЩИЙ (из других ответов):

// 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);

самый простой способ:

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'

вот чего я достиг:

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

это заколдовало меня бинишкумар


как создать пустой двумерный массив (одна строка)

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

2 и 4 первого и второго измерений соответственно.

мы используем Array.from, который может принимать array-like param и необязательное сопоставление для каждого из элементов.

массив.от (arrayLike [, mapFn [, thisArg]])

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

тот же трюк можно использовать для создайте массив JavaScript, содержащий 1...N


другой вариант (но более неэффективных 12% с n = 10,000)

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

снижение производительности происходит с тем, что мы должны иметь первые значения измерения, инициализированные для запуска .map. Запомните это Array не будет выделять позиции, пока вы не закажете его через .fill или прямое значение назначение.

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

последующие

почему это не работает?

 Array(2).fill(Array(4));

в то время как он возвращает, по-видимому, желаемый двумерный массив ([ [ <4 empty items> ], [ <4 empty items> ] ]), есть уловка: первые массивы измерений были скопированы по ссылке. Это означает arr[0][0] = 'foo' фактически изменил бы две строки вместо одной.

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

двумерные массивы создаются так же, как одномерные массивы. И вы получаете к ним доступ, как array[0][1].

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

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

Я не уверен, что кто - то ответил на это, но я обнаружил, что это сработало для меня довольно хорошо -

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

например:

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

для 2-мерного массива, например.


чтобы создать 2D-массив в javaScript, мы можем сначала создать массив, а затем добавить массивы в качестве его элементов. Этот метод вернет 2D-массив с заданным количеством строк и столбцов.

function Create2DArray(rows,columns) {
   var x = new Array(rows);
   for (var i = 0; i < rows; i++) {
       x[i] = new Array(columns);
   }
   return x;
}

для создания массива используйте этот метод, как показано ниже.

var array = Create2DArray(10,20);

Использовать Массив Понимания

в JavaScript 1.7 и выше вы можете использовать выделения массива для создания двумерных массивов. Вы также можете фильтровать и / или манипулировать записями при заполнении массива и не использовать циклы.

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 массив, который вы хотите, и заполните его значением по умолчанию, вызвав

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],
         ]
*/

больше примеров и документации можно найти здесь.

обратите внимание, что это не стандартная функция, но.


для любителей одного лайнера массив.от ()

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

еще один (из комментария по dmitry_romanov) использовать Array ().fill ()

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

мой подход очень похож на ответ @Bineesh, но с более общим подходом.

вы можете объявить двойной массив следующим образом:

var myDoubleArray = [[]];

и хранение и доступ к содержимому следующим образом:

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'],) 

это напечатает ожидаемый результат

[ 9, 8 ] 9 123

Я нашел ниже самый простой способ:

var array1 = [[]];   
array1[0][100] = 5; 

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

Я должен был сделать гибкую функцию массива, чтобы добавить к ней "записи" по мере необходимости и иметь возможность обновлять их и делать любые вычисления, прежде чем отправлять их в базу данных для дальнейшей обработки. Вот код, надеюсь это поможет :).

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"
}

Не стесняйтесь, чтобы оптимизировать и / или указать на ошибки :)


Javascript не поддерживает двумерные массивы, вместо этого мы храним массив внутри другого массива и извлекаем данные из этого массива в зависимости от того, к какой позиции этого массива вы хотите получить доступ. Помните, что нумерация массивов начинается с ноль.

Пример Кода:

/* 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

ниже одного, создает матрицу 5x5 и заполняет их null

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

console.log(md);

вот быстрый способ, который я нашел, чтобы сделать двумерный массив.

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

вы можете легко превратить эту функцию в функцию в ES5.

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)) эквивалентно doing Array(null, null, null).

теперь, когда мы создали фактический заполненный массив, все, что нам нужно сделать, это вызвать map и создать второй слой (y).


вы можете выделить массив строк, где каждая строка представляет собой массив одинаковой длины. Или вы можете выделить одномерный массив с элементами строк * столбцов и определить методы сопоставления координат строк/столбцов индексам элементов.

какую бы реализацию вы ни выбрали, если вы обернете ее в объект, вы можете определить методы доступа в прототипе, чтобы сделать API простым в использовании.


Я нашел, что этот код работает для меня:

var map = [
    []
];

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

...

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];
        }
    }
}

упрощенный пример:

var blocks = [];

blocks[0] = [];

blocks[0][0] = 7;

одна строка для создания m * n 2-мерного массива, заполненного 0.

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

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 = '<ol>';
  for ( var i = 0; i < songs.length; i += 1) {
    listHTML += '<li>' + songs[i][0] + ' by ' + songs[i][1] + '</li>';
  }
  listHTML += '</ol>';
  print(listHTML);
}

printSongs(playList);

Я сделал модификацию Мэтью Крамльответ для создания многомерной функции массива. Я добавил размеры массива, который будет передан как переменная массива, и будет другая переменная -value, который будет использоваться для задания значений элементов последних массивов в многомерном массиве.

/*
*   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]]

рекурсивная функция для создания многомерного массива:

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;
}

постройте 4D-массив 2x3x4x2:

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