Array

Array є глобальним об'єктом, що використовується для створення масивів; які є високорівневими, спископодібними об'єктами.

Створення масиву

var fruits = ["Яблуко", "Банан"];

console.log(fruits.length);
// 2

Доступ до елементів масиву (за індексом)

var first = fruits[0];
// Яблуко

var last = fruits[fruits.length - 1];
// Банан

Обхід елементів масиву

fruits.forEach(function (item, index, array) {
  console.log(item, index);
});
// Яблуко 0
// Банан 1

Додавання в кінець масиву

var newLength = fruits.push("Апельсин");
// ["Яблуко", "Банан", "Апельсин"]

Видалення елемента з кінця масиву

var last = fruits.pop(); // видалити Апельсин (з кінця)
// ["Яблуко", "Банан"];

Видалення елемента з початку масиву

var first = fruits.shift(); // видалити Яблуко з початку
// ["Банан"];

Додавання елемента до початку масиву

var newLength = fruits.unshift("Полуниця") // додади до початку
// ["Полуниця", "Банан"];

Пошук індексу елемента в масиві

fruits.push("Манго");
// ["Полуниця", "Банан", "Манго"]

var pos = fruits.indexOf("Банан");
// 1

Видалення елемента масиву за його індексом (позицією)

var removedItem = fruits.splice(pos, 1); // ось, як видаляється елемент
// ["Полуниця", "Манго"]

Видалення елементів починаючи з певного індексу

var vegetables = ['Капуста', 'Ріпа', 'Редька', 'Морква'];
console.log(vegetables);
// ["Капуста", "Ріпа", "Редька", "Морква"]

var pos = 1, n = 2;

var removedItems = vegetables.splice(pos, n);
// ось так видаляються елементи, n визначає кількість елементів на видалення,
// від цієї позиції (pos) в напрямку кінця масиву.

console.log(vegetables);
// ["Капуста", "Морква"] (початковий масив змінено)

console.log(removedItems);
// ["Ріпа", "Редька"]

Копіювання масиву

var shallowCopy = fruits.slice(); // ось так робиться копія
// ["Полуниця", "Манго"]

Синтаксис

[element0, element1, ..., elementN]
new Array(element0, element1[, ...[, elementN]])
new Array(arrayLength)

Параметри

elementN

Масив у JavaScript ініціалізується за допомогою наперед заданих елементів, за виключенням тієї ситуації коли в конструктор Array передається тільки один аргумент і він є числом (див. параметр arrayLength нижче). Зверніть увагу на те, що це спрацьовує лише у тому випадку, якщо масив створено за допомогою  конструктора Array, а не через літерали масивів створених з допомогою синтаксу квадратних дужок.
arrayLength
Якщо єдиним аргументом (вхідним параметром) конструктора Array є ціле число від 0 до 232-1 (включно), буде повернено новий JavaScript-масив з властивістю length рівною цьому числу.  Зверніть увагу, що цей масив матиме пусті слоти, а не слоти зі значеннями undefined. Якщо аргументом буде будь-яке інше число, виникне виняток RangeError.

Опис

Масиви - це спископодібні об'єкти, чий прототип має методи для операцій обходу та зміни масиву. Ані довжина масиву, ані типи його елементів не є незмінними. Довжина масиву може змінитись будь-коли, як і позиція даних в масиві; тому їх використання залежить від рішення програміста. Взагалі, це зручні характеристики; але якщо ці особливості не є бажаними для ваших конкретних цілей, ви можете розглянути можливість використання типізованих масивів.

Масиви не можуть використовувати рядки у якості індексів елементів (як асоціативні масиви), а тільки цілі числа(індекси). Присвоєння або звернення через не цілочисельні значення, з використанням квадратних дужок (або через крапку), не присвоїть або не отримає елемент з самого списку масиву, але присвоїть чи отримає доступ до змінної, пов'язаної з колекцією властивостей об'єкта(властивості) цього масиву. Об'єктні властивості масиву та список елементів масиву є відокремленими, і операції обходу та зміни цього масиву не застосовуються до цих іменованих властивостей.

Доступ до елементів масиву

Масиви в JavaScript індексуються з нуля: перший елемент масиву має індекс, який дорівнює 0, а індекс останнього елемента відповідає значенню властивості масиву length мінус 1. Використання неправильного індексу повертає undefined.

var arr = ['це перший елемент', 'це другий елемент'];
console.log(arr[0]);              // виводить 'це перший елемент'
console.log(arr[1]);              // виводить 'це другий елемент'
console.log(arr[arr.length - 1]); // виводить 'це другий елемент'

Елементи масиву є властивостями об'єкта, так само, як toString є властивістю, але спроби звернутися до елемента масиву наступним чином згенерує синтаксичну помилку через неправильне ім'я властивості:

console.log(arr.0); // є синтаксична помилка

В масивах JavaScript немає нічого особливого, що призводить до цього. До властивостей JavaScript, які починаються з цифри, не можна звертатися через крапку; необхідно звертатися через квадратні дужки. Наприклад, якщо ви маєте об'єкт з властивістю під назвою '3d', до неї можна звертатися тільки через квадратні дужки. Приклад:

var years = [1950, 1960, 1970, 1980, 1990, 2000, 2010];
console.log(years.0);   // є синтаксична помилка
console.log(years[0]);  // працює вірно
renderer.3d.setTexture(model, 'character.png');     // є синтаксична помилка
renderer['3d'].setTexture(model, 'character.png');  // працює вірно

Зверніть увагу, що '3d' має писатися в лапках. Індекси масивів JavaScript також можна писати в лапках (напр., years['2'] замість years[2]), хоча це не обов'язково. Індекс 2 у years[2] примусово перетворюється на рядок рушієм JavaScript через неявне перетворення toString. Саме через це '2' та '02' займали б два різні слоти в об'єкті years і наступний приклад дорівнював би true:

console.log(years['2'] != years['02']);

Схожим чином до властивостей об'єкта, які є зарезервованими словами (!) можна звертатися тільки через рядкові значення у квадратних дужках (але до них можна звертатися через крапку у firefox 40.0a2 наприклад):

var promise = {
  'var'  : 'text',
  'array': [1, 2, 3, 4]
};

console.log(promise['array']);

Зв'язок між length та числовими властивостями

У масивах JavaScript властивість length та числові властивості взаємопов'язані. Декілька з вбудованих методів масивів (напр., join, slice, indexOf, і т.д.) враховують значення властивості length під час виконання. Інші методи (напр., push, splice, і т.д.) призводять до зміни властивості масиву length.

var fruits = [];
fruits.push('банан', 'яблуко', 'персик');

console.log(fruits.length); // 3

Присвоєння властивості до масиву JavaScript змінить властивість масиву length відповідним чином, якщо властивість є коректним індексом масиву, і цей індекс знаходиться поза поточними межами масиву:

fruits[5] = 'манго';
console.log(fruits[5]); // 'манго'
console.log(Object.keys(fruits));  // ['0', '1', '2', '5']
console.log(fruits.length); // 6

Збільшення значення length.

fruits.length = 10;
console.log(Object.keys(fruits)); // ['0', '1', '2', '5']
console.log(fruits.length); // 10

Однак, зменшення значення властивості length видаляє елементи.

fruits.length = 2;
console.log(Object.keys(fruits)); // ['0', '1']
console.log(fruits.length); // 2

Це пояснюється далі на сторінці Array.length.

Створення масиву з використанням результату пошуку збігів

Пошук збігів між регулярним виразом та рядком може створити масив JavaScript. Цей масив має властивості та елементи, які надають інформацію про збіг. Такий масив повертається методами RegExp.exec, String.match та String.replace. Щоб краще пояснити ці властивості та елементи, подивіться на наступний приклад, а тоді зверніться до таблиці нижче:

// Пошук послідовності з однієї d, далі одна або більше b, далі одна d
// Запам'ятати всі b і d, яка йде за ними
// Ігнорувати регістр

var myRe = /d(b+)(d)/i;
var myArray = myRe.exec('cdbBdbsbz');

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

Властивість/Елемент Опис Приклад
input Властивість тільки для читання, відображає початковий рядок, в якому виконується пошук збігів з регулярним виразом. cdbBdbsbz
index Властивість тільки для читання, індекс збігу у рядку, нумерується з нуля. 1
[0] Елемент тільки для читання, який містить символи останнього збігу. dbBd
[1], ...[n] Елементи тільки для читання, які містять підрядки збігу, що заключені у дужки, якщо такі є у регулярному виразі. Кількість можливих підрядків у дужках є необмеженою. [1]: bB
[2]: d

Властивості

Array.length
Властивість length конструктора Array, дорівнює 1.
Array.prototype
Дозволяє додавати властивості до усіх масивів.

Методи

Array.from()
Створює новий екземпляр Array з подібного до масиву або ітерабельного об'єкта.
Array.isArray()
Повертає true, якщо змінна є масивом, якщо ні, то повертає false.
Array.of()
Створює новий екземпляр Array з кількістю аргументів, заданих через змінну, незважаючи на кількість або тип аргументів.

Екземпляри Array

Всі екземпляри Array наслідуються від Array.prototype. Прототип конструктора Array може бути змінений, що вплине на всі екземпляри Array.

Властивості

Array.prototype.constructor
Визначає функцію, що створює прототип об'єкта.
Array.prototype.length
Відображає кількість елементів в масиві.
Array.prototype[@@unscopables]
Символ, який містить назви властивостей, які повинні бути виключені з області зв'язування with.

Методи

Методи модифікації

Ці методи модифікують масив:

Array.prototype.copyWithin()
Копіює послідовність елементів масиву всередині масиву.
Array.prototype.fill()
Заповнює всі елементи масиву від початкового індексу до кінцевого статичними значеннями.
Array.prototype.pop()
Видаляє та повертає останній елемент масиву.
Array.prototype.push()
Додає один чи більше елементів  в кінець масиву та повертає нову довжину масиву.
Array.prototype.reverse()
Змінює порядок елементів масиву на протилежний, викорустовуючи той самий масив — перший стає останнім, а останній - першим.
Array.prototype.shift()
Видаляє та повертає перший елемент масиву.
Array.prototype.sort()
Сортує елементи всередині масиву, та повертає цей масив.
Array.prototype.splice()
Добавляє і/або видаляє елементи з масиву.
Array.prototype.unshift()
Добавляє один або більше елементів у початок масиву та повертає нову довжину масиву.

Методи доступу

Ці методи не модифікують масив та повертають якесь його представлення.

Array.prototype.concat()
Повертає новий масив, який складається з цього масиву, об'єднаного з іншим(и) масив(ом/ами) та/або іншими значеннями.
Array.prototype.includes() This is an experimental API that should not be used in production code.
Визначає, чи масив містить певний елемент,  повертаючи, відповідно, true або false.
Array.prototype.indexOf()
Повертає перший (останній) індекс елемента всередині даного масиву, який дорівнює вказаному значенню, або -1 якщо нічого не було знайдено.
Array.prototype.join()
Об'єднує всі елементи масиву у рядок.
Array.prototype.lastIndexOf()
Повертає останній (найбільший) індекс елемента всередині даного масиву, який рівний вказаному значенню, або -1 якщо нічого не було знайдено.
Array.prototype.slice()
Витягує частину масиву та повертає новий масив.
Array.prototype.toSource() This API has not been standardized.
Повертає літерал масиву, який відображає вказаний масив; ви можете використовувати це значення для створення нового масиву. Перевизначає метод Object.prototype.toSource().
Array.prototype.toString()
Повертає рядок, яка відображає даний масив та його елементи. Перевизначає метод Object.prototype.toString().
Array.prototype.toLocaleString()
Повертає локалізований рядок, яка відображає даний масив та його елементи. Перевизначає метод Object.prototype.toLocaleString().

Методи перебору

Декілька методів приймають у якості аргументів функції, які будуть викликані у процесі обробки масиву. Коли ці методи викликаються, довжина поля length вибраного масиву запам'ятовується, і будь-які елементи, додані поза цією довжиною зсередини функції зворотнього виклику (callback), не будуть обходитися. Інші зміни до масиву (встановлення значення елементу або його видалення) можуть впливати на результат операції, якщо метод після цього звертається до зміненого елемента. Хоча специфічна поведінка цих методів у даних випадках є добре визначеною, не варто на неї надто покладатися, щоб не заплутати тих, хто може прочитати ваш код. Якщо вам необхідно змінити даний масив, краще скопіюйте його у новий масив.

Array.prototype.entries()
Повертає новий об'єкт Array Iterator, який містить пари ключ/значення для кожного індекса в даному масиві.
Array.prototype.every()
Повертає true, якщо кожен елемент у цьому масиві виконує умови переданої тест-функції.
Array.prototype.filter()
Створює новий масив зі всіма елементами цього масиву, для яких передана функція фільтрації повертае true.
Array.prototype.find()
Повертає знайдене у масиві значення, якщо елемент у цьому масиві виконує умови переданої тест-функції або undefined якщо елемента не знайдено.
Array.prototype.findIndex()
Повертає знайдений у масиві індекс, якщо елемент у цьому масиві виконує умови переданої тест-функції або -1 якщо елемента не знайдено.
Array.prototype.forEach()
Викликає функцію для кожного елементу масиву.
Array.prototype.keys()
Повертає новий об'єкт Array Iterator, який містить ключі для кожного індекса в даному масиві.
Array.prototype.map()
Створює новий масив з результатами виклику на кожному елементі масиву переданої функції.
Array.prototype.reduce()
Застосовує функцію над акумулятором та кожним значенням даного масиву (зліва направо), щоб скоротити його до єдиного значення.
Array.prototype.reduceRight()
Застосовує функцію над акумулятором та кожним значенням даного масиву (справа наліво), щоб скоротити його до єдиного значення.
Array.prototype.some()
Повертає true, якщо принаймні один елемент у цьому масиві виконує умови переданої тест-функції.
Array.prototype.values()
Повертає новий об'єкт Array Iterator, який містить значення для кожного індекса в масиві.
Array.prototype[@@iterator]()
Повертає новий об'єкт Array Iterator, який містить значення для кожного індекса в масиві.

Загальні методи масивів

Загальні методи масивів є нестандартними, застарілими і будуть прибрані найближчим часом.

Іноді ви б хотіли застосувати методи масивів на рядках або інших подібних до масиву об'єктах (таких як arguments у функції). В такому випадку, ви розглядаєте рядок як масив символів (чи не об'єкт масиву як масив). Наприклад, для того, щоб перевірити, що кожний символ у змінній str є літерою, ви б написали:

function isLetter(character) {
  return character >= 'a' && character <= 'z';
}

if (Array.prototype.every.call(str, isLetter)) {
  console.log("Рядок '" + str + "' містить тільки літери!");
}

Такий запис є доволі марнотратним, і у JavaScript 1.6 було запроваджено загальне скорочення:

if (Array.every(str, isLetter)) {
  console.log("Рядок '" + str + "' містить тільки літери!");
}

Загальні методи також доступні у рядках.

Вони не є частиною стандартів ECMAScript і не підтримуються не Gecko оглядачами. У якості стандартної альтернативи, ви можете перетворити ваш об'єкт на справжній масив з допомогою методу Array.from(); хоча цей метод може не підтримуватися у старих оглядачах:

if (Array.from(str).every(isLetter)) {
  console.log("Рядок '" + str + "' містить тільки літери!");
}

Приклади

Створення масиву

Наступний приклад створює масив msgArray довжиною 0, потім додає значення елементам msgArray[0] та msgArray[99], змінюючи довжину масиву на 100.

var msgArray = [];
msgArray[0] = 'Привіт';
msgArray[99] = 'світ';

if (msgArray.length === 100) {
  console.log('Довжина масиву 100.');
}

Створення двовимірного масиву

Наступний код створює шахівницю у вигляді двовимірного масиву рядків. Перший хід робиться копіюванням 'п' з (6,4) до (4,4). Стара позиція (6,4) робиться порожньою.

var board = [
  ['Т','Н','С','Ф','К','С','Н','Т'],
  ['П','П','П','П','П','П','П','П'],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  ['п','п','п','п','п','п','п','П'],
  ['т','н','с','ф','к','с','н','т'] ];

console.log(board.join('\n') + '\n\n');

// Перемістити королівського пішака вперед на 2
board[4][4] = board[6][4];
board[6][4] = ' ';
console.log(board.join('\n'));

Ось результат:

Т,Н,С,Ф,К,С,Н,Т
П,П,П,П,П,П,П,П
 , , , , , , ,
 , , , , , , ,
 , , , , , , ,
 , , , , , , ,
п,п,п,п,п,п,п,п
т,н,с,ф,к,с,н,т

Т,Н,С,Ф,К,С,Н,Т
П,П,П,П,П,П,П,П
 , , , , , , ,
 , , , , , , ,
 , , , ,п, , ,
 , , , , , , ,
п,п,п,п, ,п,п,п
т,н,с,ф,к,с,н,т

Специфікації

Специфікація Статус Коментар
ECMAScript 1st Edition (ECMA-262) Standard Початкове визначення.
ECMAScript 5.1 (ECMA-262)
The definition of 'Array' in that specification.
Standard Додано нові методи: Array.isArray, indexOf, lastIndexOf, every, some, forEach, map, filter, reduce, reduceRight
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Array' in that specification.
Standard Додано нові методи: Array.from, Array.of, find, findIndex, fill, copyWithin
ECMAScript (ECMA-262)
The definition of 'Array' in that specification.
Living Standard Додано новий метод: Array.prototype.includes()

Сумісність з веб-оглядачами

BCD tables only load in the browser

Див. також