JavaScript. Двовимірні масиви. Масиви в масивах. Тривимірні масиви

Двовимірні масиви. Масиви в масивах. Тривимірні масиви


Зміст


Пошук на інших ресурсах:

1. Види двовимірних масивів. Оголошення та використання двовимірного масиву з використанням ключового слова new

У мові JavaScript дозволяється створювати двовимірні масив двох видів:

  • з однаковою кількістю елементів у кожному рядку (рисунок 1-a);
  • з довільною кількістю елементів у кожному рядку (рисунок 1-b).

При цьому, кожен елемент також може бути масивом чи іншим складним об’єктом.

JavaScript. Види двовимірних масивів

Рисунок 1. Види двовимірних масивів. Кількість елементів у кожному рядку однакова (a) та довільна (b)

 

2. Літеральне визначення двовимірного масиву []. Загальна форма

При літеральному визначенні двовимірного масиву елементи масиву задаються у зовнішніх квадратних дужках [], які, в свою чергу містять набори елементів, взятих у внутрішніх квадратних дужках.

У найбільш загальному вигляді створення двовимірного масиву розміром M×N (усі рядки мають однаковий розмір) виглядає наступним чином

var ArrayName =
  [
    [ item11, item12, ..., item1N],
    [ item21, item22, ..., item2N],
    ...
    [ itemM1, itemM2, ..., itemMN]
  ]

тут

  • ArrayName – ім’я масиву, який оголошується;
  • M – кількість рядків у масиві;
  • N – кількість стовпчиків у масиві;
  • item11, item12, …, itemMN – елементи масиву. Ці елементи можуть бути об’єктами будь-якого типу (число, рядок тощо)   навіть іншими масивами.

Якщо кількість елементів у кожному рядку різна, то загальна форма оголошення такого масиву літеральним способом може бути, наприклад, такою

var ArrayName =
  [
    [ item11, item12, ..., item1_N1 ],
    [ item21, item22, ..., item2_N2 ],
    ...
    [ itemM1, itemM2, ..., itemM_NM ]
  ]

тут

  • N1, N2, NM – відповідно кількість елементів у рядку 1 (позиція 0), рядку 2 та рядку M. Тобто, кількість елементів у кожному рядку різна.

 

3. Приклад створення двовимірної таблиці з однаковою кількістю елементів у рядку літеральним способом

У прикладі створюється двовимірна таблиця, яка зображена на рисунку 2.

Двовимірна таблиця

Рисунок 2. Двовимірна таблиця

Матриця створюється двома різними способами

// Двовимірні масиви

// Спосіб 1.
// 1. Створити двовимірну матрицю цілих чисел розміром 3*4
var M = []
M[0] = [ 2, 8, 4, 1 ] // перший рядок матриці
M[1] = [ 4, 2, 0, 9 ] // другий рядок матриці
M[2] = [ 1, 7, 5, 4 ] // третій рядок матриці

// 2. Вивести матрицю в циклі
document.write("M:<br>")
for (var i=0; i<3; i++)
{
  for (var j=0; j<4; j++)
    document.write(M[i][j] + " ")
  document.write("<br>")
}

// Спосіб 2.
var MM =
  [
    [ 2, 8, 4, 1 ],
    [ 4, 2, 0, 9 ],
    [ 1, 7, 5, 4 ]
  ]

// 2. Вивести матрицю в циклі
document.write("MM:<br>")
for (var i=0; i<3; i++)
{
  for (var j=0; j<4; j++)
    document.write(MM[i][j] + " ")
  document.write("<br>")
}

Результат

M:
2 8 4 1
4 2 0 9
1 7 5 4
MM:
2 8 4 1
4 2 0 9
1 7 5 4

 

4. Визначення двовимірного масиву з допомогою оператора new

З допомогою цього способу двовимірний масив визначається з використанням ключового слова new, імені класу Array та вказанням в дужках елементів масиву.

Нижче наведена загальна форма створення двовимірного масиву, в якому кількість елементів у всіх рядках однакова

var ArrayName = new Array(
  new Array(item11, item12, ..., item1N),
  new Array(item21, item22, ..., item2N),
  ...
  new Array(itemM1, itemM2, ..., itemMN)
)

тут

  • ArrayName – ім’я масиву, що створюється;
  • M – кількість рядків у масиві;
  • N – кількість елементів у рядку (кількість стовпців);
  • item11, item12, itemMN – елементи масиву. Це можуть бути рядки, числа, об’єкти класів та інші масиви (підмасиви).

Якщо масив містить різну кількість елементів у кожному рядку, то загальна форма створення такого масиву наступна

var ArrayName = new Array(
  new Array(item11, item12, ..., item1_N1),
  new Array(item21, item22, ..., item2_N2),
  ...
  new Array(itemM1, itemM2, ..., itemM_NM)
)

тут

  • N1, N2, NM – відповідно кількість елементів у рядку 1 (позиція 0), рядку 2 та рядку M. Тобто, кількість елементів у кожному рядку різна.

При оголошенні двовимірних масивів можна поєднувати даний спосіб створення масиву з літеральним способом (п. 2).

 

5. Приклад створення масиву чисел з різною довжиною рядків оператором new

У прикладі з допомогою оператора new створюється масив чисел який відображений на рисунку 3.

JavaScript. Масив чисел з різною довжиною рядків

Рисунок 3. Масив чисел з різною довжиною рядків

Текст прикладу наступний

// Двовимірні та багатовимірні масиви

// Створити масив з допомогою оператора new.
// Довжина кожного рядка в масиві різна

// 1. Оголошення масиву та заповнення значеннями
var M = new Array(
  new Array( 5, 9, 3),
  new Array( 8, 1.23, 2.99, 6.54, 5.4),
  new Array( 7.2, 2, -40.6, -1.03)
)

// 2. Вивести масив M поелементно
document.write("M:<br>")
for (var i=0; i<M.length; i++)
{
  for (var j=0; j<M[i].length; j++)
    document.write(M[i][j] + " ");
  document.write("<br>")
}

// 3. Вивести масив M рядками
document.write("-----------------------<br>")
document.write("M:<br>")
for (var i=0; i<M.length; i++)
  document.write(M[i]+"<br>")
document.write("-----------------------<br>")

// 3. Вивести окремий елемент масиву в масиві
document.write(M[1][2]+"<br>") // 2.99

Результат

M:
5 9 3
8 1.23 2.99 6.54 5.4
7.2 2 -40.6 -1.03
-----------------------
M:
5,9,3
8,1.23,2.99,6.54,5.4
7.2,2,-40.6,-1.03
-----------------------
2.99

 

6. Особливості використання масивів у масивах

Як було сказано вище (п. 1) елементом масиву може бути інший масив будь-якого виміру. На рисунку 4 зображено елементи масиву, які також є масивами. Щоб доступитись до елементу 7 підмасиву [2, 7, 3] потрібно звернутись M[0][0][1].

JavaScript. Масив у масиві

Рисунок 4. Масив у масиві

 

7. Приклад створення масиву в масиві літеральним способом

 

// Двовимірні та багатовимірні масиви

// Створити масив у масиві літеральним способом
var M = []
var m1 = [2, 7, 3]

M[0] = [ 5, m1, 9 ] // перший рядок таблиці
M[1] = [ 8, 1.23, [] , "abc" ] // другий рядок матриці
M[2] = [ [7.2, 1 ], [ 'a', 2 ] ] // третій рядок матриці

// 2. Вивести масив у циклі
document.write("M:<br>")
for (var i=0; i<3; i++)
{
  for (var j=0; j<M[i].length; j++)
    document.write(M[i][j] + " ")
  document.write("<br>")
}

// Вивести окремий елемент масиву в масиві
document.write(M[0][1][0]+"<br>") // 7
document.write(M[2][0][1]+"<br>") // 1
document.write(M[2][1][0]+"<br>") // 'a'

Результат

M:
5 2,7,3 9
8 1.23 abc
7.2,1 a,2
2
1
a

 

8. Приклад створення масиву в масиві поєднанням оператора new та літеральним способом

При створенні багатовимірного масиву можна поєднувати створення масиву оператором new та літеральним способом.

// Двовимірні та багатовимірні масиви

// Створити масив у масиві з допомогою оператора new.
// Сформувати масив, в якому назві пори року відповідає
// відповідний перелік місяців
// M:
// [ "December", "January", "February"]
// [ "March", "April", "May"]
// [ "June", "July", "August" ]
// [ "September", "October", "November"]

// 1. Створити масив місяців, що відповідають порі року
var M = new Array(
  ["December", "January", "February"],
  ["March", "April", "May"],
  ["June", "July", "August"],
  ["September", "October", "November"]
)

// 2. Вивести масив M
for (var i=0; i<M.length; i++)
  document.write(M[i]+"<br>");

// 3. Вивести окремий елемент масиву в масиві
document.write(M[1][2]+"<br>") // May
document.write(M[3][0]+"<br>") // September

Результат

December,January,February
March,April,May
June,July,August
September,October,November
May
September

 

9. Створення двовимірного масиву заданого розміру. Розмір задається з клавіатури. Властивість length

Умова задачі. Створити двовимірний масив розміру m×n, де m – кількість рядків, n – кількість стовпців. Значення m, n вводяться з клавіатури. Елементи масиву заповнити значеннями 1.

Розв’язок.

Після вводу m, n властивість length масиву встановлюється у відповідні значення.

// Двовимірні та багатовимірні масиви

// Задача. Створити масив заданого розміру m*n,
// де m, n вводяться з клавіатури.
// Заповнити масив значеннями 1.

// 1. Ввести m, n
var m = prompt("m = ")
var n = prompt("n = ")

// 2. Оголошення масиву
var A = new Array()

// 3. Задати кількість рядків
A.length = m;

// 4. Задати кількість стовпців
for (var i=0; i<m; i++)
{
  // Створити підмасив у масиві
  A[i] = new Array()

  // Встановити довжину масиву
  A[i].length = n
}

// 5. Заповнити масив A значеннями 1
for (var i=0; i<A.length; i++)
  for (var j=0; j<A[i].length; j++)
    A[i][j] = 1

// 6. Вивести масив A на екран
document.write("A:<br>")
for (var i=0; i<A.length; i++)
{
  for (var j=0; j<A[i].length; j++)
    document.write(A[i][j]+" ")
  document.write("<br>")
}

Результат

A:
1 1 1 1
1 1 1 1
1 1 1 1

 

10. Створення тривимірного масиву. Властивість length

При створенні тривимірного масиву розмірність кожного виміру встановлюється з допомогою властивості length як показано нижче

// Створити одновимірний масив розмірністю m
A = new Array()
A.length = m

// Додати другу розмірність n,
// отримається двовимірний масив розміром m*n
A[0] = new Array(); A[0].length = n
A[1] = new Array(); A[1].length = n
...
A[m-1] = new Array(); A[m-1].length = n

// Додати третю розмірність [k]
A[0][0] = new Array(); A[0][0].length = k
A[0][1] = new Array(); A[0][1].length = k
...
A[0][n-1] = new Array(); A[0][n-1].length = k
A[1][0] = new Array(); A[1][0].length = k
...
A[1][n-1] = new Array(); A[1][n-1].length = k
...
A[m-1][0] = new Array(); A[m-1][0].length = k
...
A[m-1][n-1] = new Array(); A[m-1][n-1].length = k

У вищенаведеному фрагменті створюється тривимірний масив з іменем A розміром m×n×k. Звичайно, що процес побудови масиву доцільніше побудувати в циклі (дивіться наступний приклад).

Після цього елементу тривимірного масиву можна присвоювати значення за зразком

A[x][y][z] = value

тут

  • A – ім’я масиву;
  • x – координата першого виміру масиву, x = 0, 1, …, m-1;
  • y – координата другого виміру масиву, y = 0, 1, …, n-1;
  • z – координата третього виміру масиву, z = 0, 1, …, k-1;
  • value – деяке значення.

 

11. Приклад створення тривимірного масиву за заданими розмірами m×n×k. Елементи масиву заповнюються випадковими цілими числами

Якщо наперед відомий розмір масиву, що має бути створений, то в цьому випадку використовується властивість length. Зміна значення цієї властивості (у лівій частині оператора =) дозволяє виділити пам’ять для заданої кількості елементів в одному вимірі масиву.

У прикладі нижче демонструється створення тривимірного масиву розміром m×n×k, де m, n, k вводяться з клавіатури. Елементи масиву заповнюються випадковими числами в діапазоні [5, 10].

Для отримання випадкового числа використовується функція Math.random().

// Двовимірні та багатовимірні масиви

// Задача. Створити масив заданого розміру m*n,
// де m, n вводяться з клавіатури.
// Заповнити масив значеннями 1.

// 1. Ввести m, n, k
var m = prompt("m = ")
var n = prompt("n = ")
var k = prompt("k = ")

// 2. Оголошення масиву, створити пустий масив
var A = new Array()

// 3. Задати кількість елементів по осі X
A.length = m;

// 4. Задати кількість елементів по осі Y
for (var i=0; i<m; i++)
{
  // Створити підмасив у масиві,
  // виділити пам'ять для другого виміру
  A[i] = new Array()

  // Встановити довжину масиву
  A[i].length = n
}

// 5. Задати кількість елементів по осі Z
for (var i=0; i<A.length; i++)
  for (var j=0; j<A[i].length; j++)
  {
    // Виділити пам'ять для третього виміру
    A[i][j] = new Array()

    // Встановити довжину третього виміру масиву
    A[i][j].length = k
  }

  // 6. Заповнити масив випадковими значеннями
  for (var i=0; i<A.length; i++)
    for (var j=0; j<A[i].length; j++)
      for (var t=0; t<A[i][j].length; t++)
        A[i][j][t] = 5 + parseInt(Math.random()*(10-5+1))

  // 7. Вивести масив A поелементно
  document.write("A:<br>")
  for (var i=0; i<A.length; i++)
    for (var j=0; j<A[i].length; j++)
      for (var t=0; t<A[i][j].length; t++)
        document.write("A["+i+"]["+j+"]["+t+"] = "+A[i][j][t]+"<br>")

Для заданих

m = 2
n = 3
k = 4

програма видала наступний результат

A:
A[0][0][0] = 9
A[0][0][1] = 5
A[0][0][2] = 5
A[0][0][3] = 10
A[0][1][0] = 9
A[0][1][1] = 7
A[0][1][2] = 10
A[0][1][3] = 8
A[0][2][0] = 5
A[0][2][1] = 6
A[0][2][2] = 10
A[0][2][3] = 6
A[1][0][0] = 6
A[1][0][1] = 6
A[1][0][2] = 7
A[1][0][3] = 5
A[1][1][0] = 6
A[1][1][1] = 6
A[1][1][2] = 10
A[1][1][3] = 6
A[1][2][0] = 9
A[1][2][1] = 7
A[1][2][2] = 5
A[1][2][3] = 6

 


Споріднені теми