aboutsummaryrefslogtreecommitdiff
path: root/files/uk/web/javascript/reference/global_objects/array/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/uk/web/javascript/reference/global_objects/array/index.html')
-rw-r--r--files/uk/web/javascript/reference/global_objects/array/index.html431
1 files changed, 431 insertions, 0 deletions
diff --git a/files/uk/web/javascript/reference/global_objects/array/index.html b/files/uk/web/javascript/reference/global_objects/array/index.html
new file mode 100644
index 0000000000..18045d9c84
--- /dev/null
+++ b/files/uk/web/javascript/reference/global_objects/array/index.html
@@ -0,0 +1,431 @@
+---
+title: Array
+slug: Web/JavaScript/Reference/Global_Objects/Array
+tags:
+ - Array
+ - JavaScript
+ - Масив
+translation_of: Web/JavaScript/Reference/Global_Objects/Array
+---
+<div>{{JSRef}}</div>
+
+<p><strong><code>Array</code></strong> є глобальним об'єктом, що використовується для створення масивів; які є високорівневими, спископодібними об'єктами.</p>
+
+<p><strong>Створення масиву</strong></p>
+
+<pre class="brush: js">var fruits = ["Яблуко", "Банан"];
+
+console.log(fruits.length);
+// 2
+</pre>
+
+<p><strong>Доступ до елементів масиву (за індексом)</strong></p>
+
+<pre class="brush: js">var first = fruits[0];
+// Яблуко
+
+var last = fruits[fruits.length - 1];
+// Банан
+</pre>
+
+<p><strong>Обхід елементів масиву</strong></p>
+
+<pre class="brush: js">fruits.forEach(function (item, index, array) {
+  console.log(item, index);
+});
+// Яблуко 0
+// Банан 1
+</pre>
+
+<p><strong>Додавання в кінець масиву</strong></p>
+
+<pre class="brush: js">var newLength = fruits.push("Апельсин");
+// ["Яблуко", "Банан", "Апельсин"]
+</pre>
+
+<p><strong>Видалення елемента з кінця масиву</strong></p>
+
+<pre class="brush: js">var last = fruits.pop(); // видалити Апельсин (з кінця)
+// ["Яблуко", "Банан"];
+</pre>
+
+<p><strong>Видалення елемента з початку масиву</strong></p>
+
+<pre class="brush: js">var first = fruits.shift(); // видалити Яблуко з початку
+// ["Банан"];
+</pre>
+
+<p><strong>Додавання елемента до початку масиву</strong></p>
+
+<pre class="brush: js">var newLength = fruits.unshift("Полуниця") // додади до початку
+// ["Полуниця", "Банан"];
+</pre>
+
+<p><strong>Пошук індексу елемента в масиві</strong></p>
+
+<pre class="brush: js">fruits.push("Манго");
+// ["Полуниця", "Банан", "Манго"]
+
+var pos = fruits.indexOf("Банан");
+// 1
+</pre>
+
+<p><strong>Видалення елемента масиву за його індексом (позицією)</strong></p>
+
+<pre class="brush: js">var removedItem = fruits.splice(pos, 1); // ось, як видаляється елемент
+// ["Полуниця", "Манго"]
+</pre>
+
+<p><strong>Видалення елементів починаючи з певного індексу</strong></p>
+
+<pre class="brush: js">var vegetables = ['Капуста', 'Ріпа', 'Редька', 'Морква'];
+console.log(vegetables);
+// ["Капуста", "Ріпа", "Редька", "Морква"]
+
+var pos = 1, n = 2;
+
+var removedItems = vegetables.splice(pos, n);
+// ось так видаляються елементи, n визначає кількість елементів на видалення,
+// від цієї позиції (pos) в напрямку кінця масиву.
+
+console.log(vegetables);
+// ["Капуста", "Морква"] (початковий масив змінено)
+
+console.log(removedItems);
+// ["Ріпа", "Редька"]</pre>
+
+<p><strong>Копіювання масиву</strong></p>
+
+<pre class="brush: js">var shallowCopy = fruits.slice(); // ось так робиться копія
+// ["Полуниця", "Манго"]
+</pre>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="syntaxbox"><code>[<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>]
+new Array(<var>element0</var>, <var>element1</var>[, ...[, <var>elementN</var>]])
+new Array(<var>arrayLength</var>)</code>
+</pre>
+
+<dl>
+ <dt>
+ <h3 id="Параметри">Параметри</h3>
+ </dt>
+</dl>
+
+<p><code>element<em>N</em></code></p>
+
+<dl>
+ <dd>Масив у JavaScript ініціалізується за допомогою наперед заданих елементів, за виключенням тієї ситуації коли в конструктор <code>Array</code> передається тільки один аргумент і він є числом (див. параметр <code>arrayLength</code> нижче). Зверніть увагу на те, що це спрацьовує лише у тому випадку, якщо масив створено за допомогою  конструктора <code>Array</code>, а не через літерали масивів створених з допомогою синтаксу квадратних дужок.</dd>
+ <dt><code>arrayLength</code></dt>
+ <dd>Якщо єдиним аргументом (вхідним параметром) конструктора <code>Array</code> є ціле число від 0 до 2<sup>32</sup>-1 (включно), буде повернено новий JavaScript-масив з властивістю length рівною цьому числу.  <strong>Зверніть увагу</strong>, що цей масив матиме пусті слоти, а не слоти зі значеннями <code>undefined</code>. Якщо аргументом буде будь-яке інше число, виникне виняток <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/RangeError">RangeError</a>.</dd>
+</dl>
+
+<h2 id="Опис">Опис</h2>
+
+<p>Масиви - це спископодібні об'єкти, чий прототип має методи для операцій обходу та зміни масиву. Ані довжина масиву, ані типи його елементів не є незмінними. Довжина масиву може змінитись будь-коли, як і позиція даних в масиві; тому їх використання залежить від рішення програміста. Взагалі, це зручні характеристики; але якщо ці особливості не є бажаними для ваших конкретних цілей, ви можете розглянути можливість використання типізованих масивів.</p>
+
+<p>Масиви не можуть використовувати рядки у якості індексів елементів (як <a href="https://uk.wikipedia.org/wiki/%D0%90%D1%81%D0%BE%D1%86%D1%96%D0%B0%D1%82%D0%B8%D0%B2%D0%BD%D0%B8%D0%B9_%D0%BC%D0%B0%D1%81%D0%B8%D0%B2">асоціативні масиви</a>), а тільки цілі числа(індекси). Присвоєння або звернення через не цілочисельні значення, з використанням <a href="https://developer.mozilla.org/uk/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties">квадратних дужок</a> (або <a href="https://developer.mozilla.org/uk/docs/Web/JavaScript/Reference/Operators/Property_Accessors">через крапку</a>), не присвоїть або не отримає елемент з самого списку масиву, але присвоїть чи отримає доступ до змінної, пов'язаної з <a href="https://developer.mozilla.org/uk/docs/Web/JavaScript/Data_structures#Properties">колекцією властивостей об'єкта</a>(властивості) цього масиву. Об'єктні властивості масиву та список елементів масиву є відокремленими, і <a href="https://developer.mozilla.org/uk/docs/Web/JavaScript/Guide/Indexed_collections#Array_methods">операції обходу та зміни </a>цього масиву не застосовуються до цих іменованих властивостей.</p>
+
+<h3 id="Доступ_до_елементів_масиву">Доступ до елементів масиву</h3>
+
+<p>Масиви в JavaScript індексуються з нуля: перший елемент масиву має індекс, який дорівнює 0, а індекс останнього елемента відповідає значенню властивості масиву {{jsxref("Array.length", "length")}} мінус 1. Використання неправильного індексу повертає <code>undefined</code>.</p>
+
+<pre class="brush: js">var arr = ['це перший елемент', 'це другий елемент'];
+console.log(arr[0]); // виводить 'це перший елемент'
+console.log(arr[1]); // виводить 'це другий елемент'
+console.log(arr[arr.length - 1]); // виводить 'це другий елемент'
+</pre>
+
+<p>Елементи масиву є властивостями об'єкта, так само, як <code>toString</code> є властивістю, але спроби звернутися до елемента масиву наступним чином згенерує синтаксичну помилку через неправильне ім'я властивості:</p>
+
+<pre class="brush: js">console.log(arr.0); // є синтаксична помилка
+</pre>
+
+<p>В масивах JavaScript немає нічого особливого, що призводить до цього. До властивостей JavaScript, які починаються з цифри, не можна звертатися через крапку; необхідно звертатися через квадратні дужки. Наприклад, якщо ви маєте об'єкт з властивістю під назвою <code>'3d'</code>, до неї можна звертатися тільки через квадратні дужки. Приклад:</p>
+
+<pre class="brush: js">var years = [1950, 1960, 1970, 1980, 1990, 2000, 2010];
+console.log(years.0); // є синтаксична помилка
+console.log(years[0]); // працює вірно
+</pre>
+
+<pre class="brush: js">renderer.3d.setTexture(model, 'character.png'); // є синтаксична помилка
+renderer['3d'].setTexture(model, 'character.png'); // працює вірно
+</pre>
+
+<p>Зверніть увагу, що <code>'3d'</code> має писатися в лапках. Індекси масивів JavaScript також можна писати в лапках (напр., <code>years['2']</code> замість <code>years[2]</code>), хоча це не обов'язково. Індекс 2 у <code>years[2]</code> примусово перетворюється на рядок рушієм JavaScript через неявне перетворення <code>toString</code>. Саме через це <code>'2'</code> та <code>'02'</code> займали б два різні слоти в об'єкті <code>years</code> і наступний приклад дорівнював би <code>true</code>:</p>
+
+<pre class="brush: js">console.log(years['2'] != years['02']);
+</pre>
+
+<p>Схожим чином до властивостей об'єкта, які є зарезервованими словами (!) можна звертатися тільки через рядкові значення у квадратних дужках (але до них можна звертатися через крапку у firefox 40.0a2 наприклад):</p>
+
+<pre class="brush: js">var promise = {
+ 'var' : 'text',
+ 'array': [1, 2, 3, 4]
+};
+
+console.log(promise['array']);
+</pre>
+
+<h3 id="Зв'язок_між_length_та_числовими_властивостями">Зв'язок між <code>length</code> та числовими властивостями</h3>
+
+<p>У масивах JavaScript властивість {{jsxref("Array.length", "length")}} та числові властивості взаємопов'язані. Декілька з вбудованих методів масивів (напр., {{jsxref("Array.join", "join")}}, {{jsxref("Array.slice", "slice")}}, {{jsxref("Array.indexOf", "indexOf")}}, і т.д.) враховують значення властивості {{jsxref("Array.length", "length")}} під час виконання. Інші методи (напр., {{jsxref("Array.push", "push")}}, {{jsxref("Array.splice", "splice")}}, і т.д.) призводять до зміни властивості масиву {{jsxref("Array.length", "length")}}.</p>
+
+<pre class="brush: js">var fruits = [];
+fruits.push('банан', 'яблуко', 'персик');
+
+console.log(fruits.length); // 3
+</pre>
+
+<p>Присвоєння властивості до масиву JavaScript змінить властивість масиву {{jsxref("Array.length", "length")}} відповідним чином, якщо властивість є коректним індексом масиву, і цей індекс знаходиться поза поточними межами масиву:</p>
+
+<pre class="brush: js">fruits[5] = 'манго';
+console.log(fruits[5]); // 'манго'
+console.log(Object.keys(fruits)); // ['0', '1', '2', '5']
+console.log(fruits.length); // 6
+</pre>
+
+<p>Збільшення значення {{jsxref("Array.length", "length")}}.</p>
+
+<pre class="brush: js">fruits.length = 10;
+console.log(Object.keys(fruits)); // ['0', '1', '2', '5']
+console.log(fruits.length); // 10
+</pre>
+
+<p>Однак, зменшення значення властивості {{jsxref("Array.length", "length")}} видаляє елементи.</p>
+
+<pre class="brush: js">fruits.length = 2;
+console.log(Object.keys(fruits)); // ['0', '1']
+console.log(fruits.length); // 2
+</pre>
+
+<p>Це пояснюється далі на сторінці {{jsxref("Array.length")}}.</p>
+
+<h3 id="Створення_масиву_з_використанням_результату_пошуку_збігів">Створення масиву з використанням результату пошуку збігів</h3>
+
+<p>Пошук збігів між регулярним виразом та рядком може створити масив JavaScript. Цей масив має властивості та елементи, які надають інформацію про збіг. Такий масив повертається методами {{jsxref("RegExp.exec")}}, {{jsxref("String.match")}} та {{jsxref("String.replace")}}. Щоб краще пояснити ці властивості та елементи, подивіться на наступний приклад, а тоді зверніться до таблиці нижче:</p>
+
+<pre class="brush: js">// Пошук послідовності з однієї d, далі одна або більше b, далі одна d
+// Запам'ятати всі b і d, яка йде за ними
+// Ігнорувати регістр
+
+var myRe = /d(b+)(d)/i;
+var myArray = myRe.exec('cdbBdbsbz');
+</pre>
+
+<p>Властивості та елементи, які повертаються в результаті даного пошуку збігів:</p>
+
+<table class="fullwidth-table">
+ <tbody>
+ <tr>
+ <td class="header">Властивість/Елемент</td>
+ <td class="header">Опис</td>
+ <td class="header">Приклад</td>
+ </tr>
+ <tr>
+ <td><code>input</code></td>
+ <td>Властивість тільки для читання, відображає початковий рядок, в якому виконується пошук збігів з регулярним виразом.</td>
+ <td>cdbBdbsbz</td>
+ </tr>
+ <tr>
+ <td><code>index</code></td>
+ <td>Властивість тільки для читання, індекс збігу у рядку, нумерується з нуля.</td>
+ <td>1</td>
+ </tr>
+ <tr>
+ <td><code>[0]</code></td>
+ <td>Елемент тільки для читання, який містить символи останнього збігу.</td>
+ <td>dbBd</td>
+ </tr>
+ <tr>
+ <td><code>[1], ...[n]</code></td>
+ <td>Елементи тільки для читання, які містять підрядки збігу, що заключені у дужки, якщо такі є у регулярному виразі. Кількість можливих підрядків у дужках є необмеженою.</td>
+ <td>[1]: bB<br>
+ [2]: d</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Властивості">Властивості</h2>
+
+<dl>
+ <dt><code>Array.length</code></dt>
+ <dd>Властивість length конструктора <code>Array</code>, дорівнює 1.</dd>
+ <dt>{{jsxref("Array.prototype")}}</dt>
+ <dd>Дозволяє додавати властивості до усіх масивів.</dd>
+</dl>
+
+<h2 id="Методи">Методи</h2>
+
+<dl>
+ <dt>{{jsxref("Array.from()")}}</dt>
+ <dd>Створює новий екземпляр <code>Array</code> з подібного до масиву або ітерабельного об'єкта.</dd>
+ <dt>{{jsxref("Array.isArray()")}}</dt>
+ <dd>Повертає true, якщо змінна є масивом, якщо ні, то повертає false.</dd>
+ <dt>{{jsxref("Array.of()")}}</dt>
+ <dd>Створює новий екземпляр <code>Array</code> з кількістю аргументів, заданих через змінну, незважаючи на кількість або тип аргументів.</dd>
+</dl>
+
+<h2 id="Екземпляри_Array"><code>Екземпляри Array</code></h2>
+
+<p>Всі екземпляри <code>Array</code> наслідуються від {{jsxref("Array.prototype")}}. Прототип конструктора <code>Array</code> може бути змінений, що вплине на всі екземпляри <code>Array</code>.</p>
+
+<h3 id="Властивості_2">Властивості</h3>
+
+<div>{{page('uk/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Властивості')}}</div>
+
+<h3 id="Методи_2">Методи</h3>
+
+<h4 id="Методи_модифікації">Методи модифікації</h4>
+
+<div>{{page('/uk/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Методи_модифікації')}}</div>
+
+<h4 id="Методи_доступу">Методи доступу</h4>
+
+<div>{{page('/uk/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Методи_доступу')}}</div>
+
+<h4 id="Методи_перебору">Методи перебору</h4>
+
+<div>{{page('uk/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Методи_перебору')}}</div>
+
+<h2 id="Загальні_методи_масивів">Загальні методи масивів</h2>
+
+<div class="warning">
+<p><strong>Загальні методи масивів є нестандартними, застарілими і будуть прибрані найближчим часом.</strong></p>
+</div>
+
+<p>Іноді ви б хотіли застосувати методи масивів на рядках або інших подібних до масиву об'єктах (таких як {{jsxref("Functions/arguments", "arguments", "", 1)}} у функції). В такому випадку, ви розглядаєте рядок як масив символів (чи не об'єкт масиву як масив). Наприклад, для того, щоб перевірити, що кожний символ у змінній <var>str</var> є літерою, ви б написали:</p>
+
+<pre class="brush: js">function isLetter(character) {
+ return character &gt;= 'a' &amp;&amp; character &lt;= 'z';
+}
+
+if (Array.prototype.every.call(str, isLetter)) {
+ console.log("Рядок '" + str + "' містить тільки літери!");
+}
+</pre>
+
+<p>Такий запис є доволі марнотратним, і у JavaScript 1.6 було запроваджено загальне скорочення:</p>
+
+<pre class="brush: js">if (Array.every(str, isLetter)) {
+  console.log("Рядок '" + str + "' містить тільки літери!");
+}</pre>
+
+<p>{{jsxref("Global_Objects/String", "Загальні методи", "#String_generic_methods", 1)}} також доступні у {{jsxref("String", "рядках")}}.</p>
+
+<p>Вони <strong>не є</strong> частиною стандартів ECMAScript і не підтримуються не Gecko оглядачами. У якості стандартної альтернативи, ви можете перетворити ваш об'єкт на справжній масив з допомогою методу {{jsxref("Array.from()")}}; хоча цей метод може не підтримуватися у старих оглядачах:</p>
+
+<pre class="brush: js">if (Array.from(str).every(isLetter)) {
+ console.log("Рядок '" + str + "' містить тільки літери!");
+}</pre>
+
+<h2 id="Приклади">Приклади</h2>
+
+<h3 id="Створення_масиву">Створення масиву</h3>
+
+<p>Наступний приклад створює масив <code>msgArray</code> довжиною 0, потім додає значення елементам <code>msgArray[0]</code> та <code>msgArray[99]</code>, змінюючи довжину масиву на 100.</p>
+
+<pre class="brush: js">var msgArray = [];
+msgArray[0] = 'Привіт';
+msgArray[99] = 'світ';
+
+if (msgArray.length === 100) {
+ console.log('Довжина масиву 100.');
+}
+</pre>
+
+<h3 id="Створення_двовимірного_масиву">Створення двовимірного масиву</h3>
+
+<p>Наступний код створює шахівницю у вигляді двовимірного масиву рядків. Перший хід робиться копіюванням 'п' з (6,4) до (4,4). Стара позиція (6,4) робиться порожньою.</p>
+
+<pre class="brush: js">var board = [
+ ['Т','Н','С','Ф','К','С','Н','Т'],
+ ['П','П','П','П','П','П','П','П'],
+ [' ',' ',' ',' ',' ',' ',' ',' '],
+ [' ',' ',' ',' ',' ',' ',' ',' '],
+ [' ',' ',' ',' ',' ',' ',' ',' '],
+ [' ',' ',' ',' ',' ',' ',' ',' '],
+ ['п','п','п','п','п','п','п','П'],
+ ['т','н','с','ф','к','с','н','т'] ];
+
+console.log(board.join('\n') + '\n\n');
+
+// Перемістити королівського пішака вперед на 2
+board[4][4] = board[6][4];
+board[6][4] = ' ';
+console.log(board.join('\n'));
+</pre>
+
+<p>Ось результат:</p>
+
+<pre class="eval">Т,Н,С,Ф,К,С,Н,Т
+П,П,П,П,П,П,П,П
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+п,п,п,п,п,п,п,п
+т,н,с,ф,к,с,н,т
+
+Т,Н,С,Ф,К,С,Н,Т
+П,П,П,П,П,П,П,П
+ , , , , , , ,
+ , , , , , , ,
+ , , , ,п, , ,
+ , , , , , , ,
+п,п,п,п, ,п,п,п
+т,н,с,ф,к,с,н,т
+</pre>
+
+<h2 id="Специфікації">Специфікації</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Специфікація</th>
+ <th scope="col">Статус</th>
+ <th scope="col">Коментар</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES1')}}</td>
+ <td>{{Spec2('ES1')}}</td>
+ <td>Початкове визначення.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES5.1', '#sec-15.4', 'Array')}}</td>
+ <td>{{Spec2('ES5.1')}}</td>
+ <td>Додано нові методи: {{jsxref("Array.isArray")}}, {{jsxref("Array.prototype.indexOf", "indexOf")}}, {{jsxref("Array.prototype.lastIndexOf", "lastIndexOf")}}, {{jsxref("Array.prototype.every", "every")}}, {{jsxref("Array.prototype.some", "some")}}, {{jsxref("Array.prototype.forEach", "forEach")}}, {{jsxref("Array.prototype.map", "map")}}, {{jsxref("Array.prototype.filter", "filter")}}, {{jsxref("Array.prototype.reduce", "reduce")}}, {{jsxref("Array.prototype.reduceRight", "reduceRight")}}</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES6', '#sec-array-objects', 'Array')}}</td>
+ <td>{{Spec2('ES6')}}</td>
+ <td>Додано нові методи: {{jsxref("Array.from")}}, {{jsxref("Array.of")}}, {{jsxref("Array.prototype.find", "find")}}, {{jsxref("Array.prototype.findIndex", "findIndex")}}, {{jsxref("Array.prototype.fill", "fill")}}, {{jsxref("Array.prototype.copyWithin", "copyWithin")}}</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-array-objects', 'Array')}}</td>
+ <td>{{Spec2('ESDraft')}}</td>
+ <td>Додано новий метод: {{jsxref("Array.prototype.includes()")}}</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Сумісність_з_веб-оглядачами">Сумісність з веб-оглядачами</h2>
+
+<div class="hidden">
+<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+</div>
+
+<p>{{Compat("javascript.builtins.Array")}}</p>
+
+<div id="compat-mobile"></div>
+
+<h2 id="Див._також">Див. також</h2>
+
+<ul>
+ <li><a href="/uk/docs/Web/JavaScript/Guide/Working_with_Objects#Indexing_object_properties">JavaScript Guide: “Indexing object properties”</a></li>
+ <li><a href="/uk/docs/Web/JavaScript/Guide/Indexed_collections#Array_object">JavaScript Guide: “Predefined Core Objects: <code>Array</code> Object”</a></li>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Operators/Array_comprehensions">Array comprehensions</a></li>
+ <li><a href="https://github.com/plusdude/array-generics">Polyfill for JavaScript 1.8.5 Array Generics and ECMAScript 5 Array Extras</a></li>
+ <li><a href="/uk/docs/Web/JavaScript/Typed_arrays">Типізовані масиви</a></li>
+</ul>