Масиви. Одновимірні масиви. Створення масиву. Властивість length. Формування масиву

---

Зміст

• 1. Поняття масиву. Види масивів
• 2. Оголошення (створення) одновимірного масиву в JavaScript
  • 2.1. Оголошення масиву з допомогою ключового слова new
  • 2.2. Літеральне створення масиву. Конструкція []
• 3. Доступ до елементів масиву. Властивості індексу масиву. Додавання елементів до масиву
• 4. Визначення розміру масиву. Властивість length
• 5. Формування масиву шляхом додавання нових елементів. Зміна довжини масиву
• 6. Приклади додавання елементів до масиву
  • 6.1. Додавання елементів з нецілочисельними індексами
  • 6.2. Додавання елементів з цілочисельними індексами
• Споріднені теми

---

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

1. Поняття масиву. Види масивів

При розробці програм часто потрібно використовувати та обробляти велику кількість даних, які є одного типу або вимагають групування за деяким критерієм. Якщо ця кількість сягає декількох десятків, сотень, тисяч та навіть мільйонів одиниць, то це вимагає введення відповідних засобів групового збереження даних та доступу до цих даних. У JavaScript, як і в будь-якій іншій мові програмування, для обробки наборів однотипних даних введено поняття масиву.

Отже, масив – це іменований набір елементів, які:

• зберігаються послідовно в пам’яті один за одним;
• мають єдиноподібний спосіб доступу до елементу шляхом індексування, завдяки чому елементи в масиві вважаються згрупованими.

У мові JavaScript елементи масиву можуть бути як одного типу так і різних типів. Кожен окремий елемент масиву:

• має свою позицію в масиві (індекс). У JavaScript перший елемент масиву має індекс 0, другий – індекс 1, і т.д.;
• зберігає значення. Доступ до елементу масиву здійснюється за індексом.

Розрізняють наступні види масивів:

• одновимірні. В одновимірних масивах елементи формуються в ряд. Доступ до елементів масиву здійснюється шляхом вказання одного індексу (позиції);
• багатовимірні. Тут елементи сформовані за двома, трьома і більше вимірами. Кожен вимір це також ряд елементів. Доступ до елементів багатовимірних масивів здійснюється на основі двох, трьох і більше індексів.

  ⇑

2. Оголошення (створення) одновимірного масиву в JavaScript

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

• з допомогою ключового слова new. У цьому випадку викликається конструкція виду new Array();
• з допомогою квадратних дужок []. Цей спосіб ще називають “літеральне визначення масиву”.

  ⇑

2.1. Оголошення масиву з допомогою ключового слова new

У найпростішому випадку, оголошення масиву з використанням оператора new виглядає наступним чином:

var ArrayName = new Array(value1, value2, ..., valueN)

тут

• ArrayName – ім’я масиву;
• value1, value2, valueN – значення, якими заповнюються елементи масиву. Тут також можна вказувати імена оголошених раніше змінних. Відповідно значення цих змінних будуть підставлятись в масив. Розмірність масиву (кількість елементів) встановлюється рівною N.

Якщо потрібно створити масив, що не містить жодного елементу (так званий “порожній” масив), то синтаксис оголошення наступний

var ArrayName = new Array()

тут ArrayName – ім’я масиву, що створюється.

Приклад.

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

// Масиви

// Створення масиву оператором new
// 1. Створити пустий масив
var EmptyArray = new Array()

// 2. Створити масив з 5 чисел типу int
var AI = new Array(7, 10, 2, 5, -3)

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

// 4. Створити масив з 4 рядків та вивести його на екран
var Seasons = new Array("Winter", "Spring", "Summer", "Autumn")
document.write("Seasons:<br>")
for (var i=0; i<Seasons.length; i++)
  document.write(Seasons[i]+" ")
document.write("<br>")

// 5. Створити масив різнотипних об'єктів
var AObj = new Array("Hello, world!", 2.88, true, '+', 3000)

// 6. Створити та вивести масив, що містить елементи на основі змінних та обчислень
var radius = 2.5
var ResultArray = new Array(
  2*Math.PI*radius,
  Math.PI*radius*radius,
  4.0/3.0*Math.PI*radius*radius*radius
)

document.write("<br>ResultArray:<br>")
for (var i=0; i<ResultArray.length; i++)
  document.write(ResultArray[i] + "<br>")
document.write("<br>")

  ⇑

2.2. Літеральне створення масиву. Конструкція []

Щоб створити масив цим способом використовується наступний загальний синтаксис

var ArrayName = [ value1, value2, ..., valueN ]

тут

• ArrayName – ім’я масиву;
• value1, value2, valueN – значення елементів масиву. Значення можуть бути також змінними чи результатами обчислень виразів.

Щоб створити “порожній” масив використовується наступний синтаксис

var ArrayName = []

тут ArrayName – ім’я масиву, що створюється.

Приклад.

// Масиви

// Створення масиву літеральним способом []
// 1. Створити пустий масив
var EmptyArray = []

// 2. Створити масив з 5 чисел типу int
var AI = [ 7, 10, 2, 5, -3 ]

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

// 4. Створити масив з 4 рядків та вивести його на екран
var Seasons = [ "Winter", "Spring", "Summer", "Autumn" ]
document.write("Seasons:<br>")
for (var i=0; i<Seasons.length; i++)
  document.write(Seasons[i]+" ")
document.write("<br>")

// 5. Створити масив різнотипних об'єктів
var AObj = [ "bestprog.net", -12.404, false, '+', 1E3 ]

// 6. Створити та вивести масив, що містить елементи на основі змінних та обчислень
var radius = 2.5
var ResultArray = [
  2*Math.PI*radius,
  Math.PI*radius*radius,
  4.0/3.0*Math.PI*radius*radius*radius
]

document.write("<br>ResultArray:<br>")
for (var i=0; i<ResultArray.length; i++)
  document.write(ResultArray[i] + "<br>")
document.write("<br>")

Результат

AI:
7 10 2 5 -3
Seasons:
Winter Spring Summer Autumn

ResultArray:
15.707963267948966
19.634954084936208
65.44984694978736

  ⇑

3. Доступ до елементів масиву. Властивості індексу масиву. Додавання елементів до масиву

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

ArrayName[index]

тут

• ArrayName – ім’я масиву;
• index – позиція в масиві. Це може бути число, рядок, символ тощо.

Після оголошення масиву з деяким набором елементів, у цьому масиві значення index формуються у зростаючому порядку, починаючи з 0 (0, 1, 2, …). Однак, мова JavaScript допускає використовувати в якості index будь-який об’єкт. Цим об’єктом може бути рядок, число з плаваючою комою, ціле число, символ тощо. Наприклад, у рядку

ArrayName['+'] = 2.88

створюється комірка зі значенням 2.88 але індекс комірки буде значення ‘+’. Тобто, у зворотній операції

var c = ArrayName['+']

змінна c буде мати значення 2.88.

Якщо задати неіснуючий індекс, то результатом буде значення undefined

var A = [ 1, 2, 5]
var item = A[15] // item = undefined

Приклад.

// Масиви. Індекс масиву

// 1. Масив чисел, індекси масиву рівні 0, 1, 2.
var AI = [ 2, 3, 8]
var t
t = AI[0] // t = 2
document.write("t = " + t + "<br>")

// 2. Індекс масиву - символ
// 2.1. Створити пустий масив
var AC = []

// 2.2. Додати елементи до масиву
AC['+'] = "Plus"
AC['-'] = "Minus"
AC['*'] = "Multiplication"

// 2.3. Отримати назву за індексом '+'
var sign = AC['+']
document.write("sign = " + sign + "<br>")

// 2.4. Отримати назву за неіснуючим індексом
sign = AC['&'] // sign = undefined
document.write("sign = " + sign + "<br>")

// 3. Індекс масиву - рядок символів
// 3.1. Створити пустий масив
var A = new Array()
A["One"] = 1
A["Two"] = 2
A["Five"] = 5

// 3.2. Отримати елемент з індексом "two"
var number = A["Two"]
document.write("number = " + number + "<br>")

// 3.3. Отримати елемент з індексом якого немає в масиві
number = A["Nine"] // number = undefined
document.write("number = " + number + "<br>")

// 3.4. Спробувати отримати елемент з індексом, ім'я якого
//      задано некоректно (з малої літери)
number = A["one"] // number = undefined
document.write("number = " + number + "<br>")

Результат

t = 2
sign = Plus
sign = undefined
number = 2
number = undefined
number = undefined

  ⇑

4. Визначення розміру масиву. Властивість length

Щоб визначити розмір масиву використовується властивість length, яка повертає ціле число, що рівне кількості елементів масиву. Звертання до властивості для масиву ArrayName може бути таким

ArrayName.length

Властивість length базується на найвищому значенні індексу занятого елементу в масиві, а не на кількості фактично створених елементів.

Приклад.

// Масиви. Отримати розмір масиву. Властивість length

// 1. Оголосити пустий масив
var EmptyArray = new Array()

// 2. Отримати та вивести розмір масиву EmptyArray
var size = EmptyArray.length   // size = 0
document.write(size + "<br>")

// 3. Оголосити масив з 3-х рядків
var AS = [ "December", "January", "February" ]
size = AS.length   // size = 3
document.write(size + "<br>")

// 4. Додати до масиву AS елемент
AS[3] = "May"
size = AS.length // size = 4
document.write(size + "<br>")

// 5. Додати до масиву AS елемент з нецілочисельним індексом
AS['&'] = 123
size = AS.length // size = 4 - розмір не змінився
document.write(size + "<br>")

Результат

0
3
4
4

  ⇑

5. Формування масиву шляхом додавання нових елементів. Зміна довжини масиву

Масив можна створювати простим додаванням нових елементів до пустого чи вже існуючого масиву. Як відомо, можна в якості індексу використовувати об’єкт рядкового, символьного типу чи навіть числового типу з плаваючою комою (float). У цьому випадку при додаванні елементу розмір масиву буде незмінний. Якщо до масиву додати елемент з індексом цілочисельного типу, то розмір масиву може змінитись, якщо значення індексу більше або рівне за поточний розмір масиву.

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

• додається один елемент (рисунок 1);
• додається декілька елементів (рисунок 2).

При додаванні одного елементу індекс цього елементу повинен бути на 1 більше максимального значимого індексу в масиві.

Рисунок 1. Додавання одного елементу. Збільшення довжини масиву на 1 (властивість A.length)

У випадку додавання декількох цілочисельних елементів, індекс елементу, що додається, як мінімум на 2 більше від максимального індексу масиву (рисунок 2). Проміжні елементи масиву заповнюються значенням undefined.

Рисунок 2. Додавання групи елементів. Збільшення довжини масиву на 4 елементи

  ⇑

6. Приклади додавання елементів до масиву

6.1. Додавання елементів з нецілочисельними індексами

У нижченаведеному коді до масиву два рази додаються елементи з індексами ‘+’ та ‘-‘. При цьому властивість length не враховує ці елементи, хоча елементи є в масиві. Після того, як до масиву додається елемент з цілочисельним індексом властивість length збільшується на 1.

// Масиви. Формування масиву

// 1. Оголосити масив з 3-х елементів типу Number
var A = new Array(2, 8, 5)
document.write(A.length) // 3

// 2. Додати елемент з індексом '+'
A['+'] = 50

// 3. Додати елемент з індексом "abcd"
A["abcd"] = 25

// 4. Вивести довжину масиву повторно
document.write("<br>" + A.length) // 3

// 5. Додати елемент з індексом 3
A[3] = 100

// 6. Ще раз вивести довжину
document.write("<br>" + A.length) // 4

Результат

3
3
4

  ⇑

6.2. Додавання елементів з цілочисельними індексами

У прикладі показано збільшення розміру масиву при додаванні до нього елементу з індексом, що на 3 позиції перевищує поточний розмір масиву.

Приклад.

// Масиви. Формування масиву

// 1. Оголосити масив з 3-х елементів типу Number
var A = new Array(2, 8, 5)
document.write("length(A) = " + A.length) // length(A) = 3

// 2. Додати елемент з індексом 6
A[6] = 50

// 3. Вивести довжину масиву та сам масив
document.write("<br>length(A) = " + A.length) // length(A) = 7

document.write("<br>")
for (var i = 0; i<A.length; i++)
  document.write(A[i] + " ")
document.write("<br>")

Результат

length(A) = 3
length(A) = 7
2 8 5 undefined undefined undefined 50

  ⇑

---

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

• Поняття циклу. Оператори циклу for, while, do-while
• Цикл for-in. Вкладені цикли. Вічний цикл

  ⇑

---