path: root/files/ru/web/javascript/guide/indexed_collections/index.html

---
title: Упорядоченные наборы данных
slug: Web/JavaScript/Guide/Indexed_collections
translation_of: Web/JavaScript/Guide/Indexed_collections
---
<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}</div>

<p class="summary">Данная глава знакомит читателя с массивами - коллекциями элементов, упорядоченных по индексу. Глава включает в себя описание массивов и массивоподобных структур, таких как {{jsxref("Array")}} и {{jsxref("TypedArray")}}.</p>

<h2 id="Array_объект"><code>Array</code> объект</h2>

<p><em>Массив</em> представляется собой упорядоченный набор значений, к которому вы ссылаетесь по имени и индексу. Допустим, у вас есть массив с именем <code>emp,</code> содержащий имена сотрудников и упорядоченный по номеру сотрудников. Следовательно, <code>emp[1]</code> будет представлять собой имя сотрудника номер один, <code>emp[2]</code> -- имя сотрудника номер два, и т.д.</p>

<p>Язык JavaScript не содержит явного типа данных "массив". Тем не менее, возможно использовать предопределенный объект <code>Array</code> и его методы для работы с массивами в создаваемых приложениях. Объект <code>Array</code> содержит методы для работы с массивами самыми различными способами, например, есть методы для объединения,  переворачивания и сортировки. Объект содержит свойство для определения длины массива, а также свойства для работы с регулярными выражениями.</p>

<h3 id="Создание_массива">Создание массива</h3>

<p>Следующие выражения создают одинаковые массивы:</p>

<pre class="brush: js">var arr = new Array(element0, element1, ..., elementN);
var arr = Array(element0, element1, ..., elementN);
var arr = [element0, element1, ..., elementN];
</pre>

<p><code>element0, element1, ..., elementN</code> - список значений элементов массива. Если значения заданы, то эти значения будут являться элементами массива после его инициализации. Свойство <code>length</code> у массива будет равно количеству аргументов.</p>

<p>Синтаксис с использованием квадратных скобок называется "литерал массива" (array literal) или "инициализатор массива". Такая запись короче, чем другие способы создания массива, и, как правило, более предпочтительна. См. <a href="/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#Array_literals" title="en-US/docs/JavaScript/Guide/Values, Variables, and Literals#Array Literals">Array literals</a>.</p>

<p>Для создания массива без элементов, но ненулевой длины, возможно использовать одно из следующих выражений:</p>

<pre class="brush: js">var arr = new Array(arrayLength);
var arr = Array(arrayLength);

// Точно такой же эффект
var arr = [];
arr.length = arrayLength;
</pre>

<div class="note">
<p><strong>Замечание</strong>: в примере выше <code>arrayLength</code> должно иметь числовой тип <code>Number</code>. В противном случае будет создан массив с единственным элементом (указанное значение). Вызванная функция <code>arr.length</code> вернет значение <code>arrayLength</code>, но на самом деле массив будет содержать пустые элементы (undefined). Использование цикла<a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in"> </a> {{jsxref("Statements/for...in","for...in")}} для обработки значений массива не вернет ни одного элемента.</p>
</div>

<p>Массивы могут быть присвоены свойству нового или уже существующего объекта, как показано ниже:</p>

<pre class="brush: js">var obj = {};
// ...
obj.prop = [element0, element1, ..., elementN];

// OR
var obj = {prop: [element0, element1, ...., elementN]}
</pre>

<p>Если вы хотите инициализировать массив одним элементом и этим элементом является число типа Number, то вы должны использовать квадратные скобки. Если вы создаёте массив с помощью Array (конструктора или функции), а единственным элементом этого массива будет число типа Number, то число это интерпретируется как длина массива (arrayLength), а не как элемент типа Number.</p>

<pre class="brush: js">var arr = [42]; // Создаёт массив  с одним элементом
var arr = Array(42); // Создаёт массив без элементов,
                     // но устанавливает длину массива arr.length в 42

// Это эквивалентно следующему
var arr = [];
arr.length = 42;
</pre>

<p>Вызов Array(N) выбросит RangeError, если N не целое значение, чья дробная часть не ноль. Следующий пример иллюстрирует это.</p>

<pre class="brush: js">var arr = Array(9.3);  // RangeError: Invalid array length
</pre>

<p>Если ваш код нуждается в создании массива с одним элементом произвольного типа данных, то безопасней использовать литеральную запись. Или создайте пустой массив, а затем добавьте необходимый элемент.</p>

<h3 id="Заполнение_массива">Заполнение массива</h3>

<p>Вы можете заполнить массив путём присвоения значений его элементам. Для примера:</p>

<pre class="brush: js">var emp = [];
emp[0] = "Casey Jones";
emp[1] = "Phil Lesh";
emp[2] = "August West";
</pre>

<div class="note">
<p><strong>Замечание:</strong> Если вы используете нецелое значение в операторе [] обращения к элементу массива, то будет создано соответствующее свойство в объекте, представляющем массив, вместо элемента массива (так как массивы в JavaScript являются объектами).</p>
</div>

<pre class="brush: js">var arr = [];
arr[3.4] = "Oranges";
console.log(arr.length);                // 0
console.log(arr.hasOwnProperty(3.4));   // true
</pre>

<p>Вы можете заполнить массив во время создания:</p>

<pre class="brush: js">var myArray = new Array("Hello", myVar, 3.14159);
var myArray = ["Mango", "Apple", "Orange"]
</pre>

<h3 id="Работа_с_элементами_массива">Работа с элементами массива</h3>

<p>Вы можете ссылаться на элементы массива путём использования их порядковых номеров. Для примера, предположим, что вы определили следующий массив:</p>

<pre class="brush: js">var myArray = ["Wind", "Rain", "Fire"];
</pre>

<p>Затем вы сослались на первый элемент массива как myArray[0] и второй элемент массива как myArray[1]. Индексация элементов массива начинается с <strong>нуля</strong>.</p>

<div class="note">
<p><strong>Замечание: </strong>оператор обращения к элементу массива (квадратные скобки []) также используется для доступа к свойствам массива (массивы также являются объектами в JavaScript). Например:</p>
</div>

<pre class="brush: js">var arr = ["one", "two", "three"];
arr[2];  // three
arr["length"];  // Вернёт число 3, так как это свойство - длина массива
</pre>

<h3 id="Понимание_length">Понимание <code>length</code></h3>

<p>На уровне реализации, массивы в JavaScript хранят свои элементы как стандартные свойства объекта, используя индекс в качестве имени свойства. Специальное свойство <code>length</code> всегда возвращает индекс последнего элемента плюс один (в примере ниже, элемент 'Dusty' размещается под индексом 30, по этому cats.length возвращает 30 + 1). Особо следует запомнить, что в JavaScript массивы индексируются с нуля: отсчет ведется с 0, а не с 1. Из этого и следует, что свойство <code><code>length</code></code> всегда на единицу больше, чем наибольший индекс хранящийся в массиве:</p>

<pre class="brush: js">var cats = [];
cats[30] = ['Dusty'];
console.log(cats.length); // 31
</pre>

<p>Также, вы можете задавать значение для <code>length</code>. Установка значения меньшего, чем количество хранящихся в массиве элементов, обрезает массив с конца; установка <code>length</code> равным 0 очищает массив полностью:</p>

<pre class="brush: js">var cats = ['Dusty', 'Misty', 'Twiggy'];
console.log(cats.length); // 3

cats.length = 2;
console.log(cats); // выводит в консоль "Dusty,Misty" - элемент "Twiggy" был удален

cats.length = 0;
console.log(cats); // выводит пустую строку; массив cats пуст

cats.length = 3;
console.log(cats); // выводит [undefined, undefined, undefined]
</pre>

<h3 id="Перебор_содержимого_массивов">Перебор содержимого массивов</h3>

<p>Очень распространенная задача - это перебор всех элементов массива и обработка каждого элемента некоторой операцией. Вот наипростейший способ сделать это:</p>

<pre class="brush: js">var colors = ['red', 'green', 'blue'];
for (var i = 0; i &lt; colors.length; i++) {
  console.log(colors[i]);
}
</pre>

<p>Если вам заранее известно, что ни один элемент массива не будет расценен как <code>false</code> при приведении к boolean — например, каждый элемент массива является <a href="/en-US/docs/DOM" title="en-US/docs/DOM">DOM</a> узлом, тогда вы можете блеснуть чуть более эффективным оборотом:</p>

<pre class="brush: js">var divs = document.getElementsByTagName('div');
for (var i = 0, div; div = divs[i]; i++) {
  /* Обработать div некоторой операцией */
}
</pre>

<p>Подход в примере выше, позволяет избежать проверки длинны массива при каждой итерации, и лишь убеждается, что переменной <code>div</code> присвоен существующий текущий элемент массива при каждом прохождении цикла.</p>

<p>Метод {{jsxref("Array.forEach", "forEach()")}} предоставляет другой способ перебора элементов:</p>

<pre class="brush: js">var colors = ['red', 'green', 'blue'];
colors.forEach(function(color) {
  console.log(color);
});
</pre>

<p>Как вариант, вы можете сократить код программы, используя стрелочные функции из ES6:</p>

<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> colors <span class="operator token">=</span> <span class="punctuation token">[</span><span class="string token">'red'</span><span class="punctuation token">,</span> <span class="string token">'green'</span><span class="punctuation token">,</span> <span class="string token">'blue'</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
colors<span class="punctuation token">.</span><span class="function token">forEach</span><span class="punctuation token">(</span>color <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>color<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
<span class="comment token">// red</span>
<span class="comment token">// green</span>
<span class="comment token">// blue</span></code></pre>

<p>Функция, переданная в метод <code>forEach</code>, будет выполнена по одному разу для каждого элемента массива, при этом сам элемент массива будет передан как аргумент в эту функцию. Элементы, значения которым не присвоены, не обрабатываются <code>forEach</code> циклом.</p>

<p>Заметьте, что элементы, пропущенные при создании массива не обрабатываются методом <code>forEach</code>, однако, <code>undefined</code> элемент обрабатывается в том случае, когда он присвоен ячейке массива вручную:</p>

<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> array <span class="operator token">=</span> <span class="punctuation token">[</span><span class="string token">'first'</span><span class="punctuation token">,</span> <span class="string token">'second'</span><span class="punctuation token">,</span> <span class="punctuation token">,</span> <span class="string token">'fourth'</span><span class="punctuation token">]</span><span class="punctuation token">;</span>

array<span class="punctuation token">.</span><span class="function token">forEach</span><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span>element<span class="punctuation token">)</span> <span class="punctuation token">{</span>
  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>element<span class="punctuation token">)</span><span class="punctuation token">;</span>
<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
<span class="comment token">// first</span>
<span class="comment token">// second</span>
<span class="comment token">// fourth</span>

<span class="keyword token">if</span> <span class="punctuation token">(</span>array<span class="punctuation token">[</span><span class="number token">2</span><span class="punctuation token">]</span> <span class="operator token">===</span> undefined<span class="punctuation token">)</span> <span class="punctuation token">{</span>
  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'array[2] is undefined'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// true</span>
<span class="punctuation token">}</span>

array <span class="operator token">=</span> <span class="punctuation token">[</span><span class="string token">'first'</span><span class="punctuation token">,</span> <span class="string token">'second'</span><span class="punctuation token">,</span> undefined<span class="punctuation token">,</span> <span class="string token">'fourth'</span><span class="punctuation token">]</span><span class="punctuation token">;</span>

array<span class="punctuation token">.</span><span class="function token">forEach</span><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span>element<span class="punctuation token">)</span> <span class="punctuation token">{</span>
  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>element<span class="punctuation token">)</span><span class="punctuation token">;</span>
<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
<span class="comment token">// first</span>
<span class="comment token">// second</span>
<span class="comment token">// undefined</span>
<span class="comment token">// fourth</span></code></pre>

<p>Так как в JavaScript элементы массива хранятся как обычные свойства объекта, использование  {{jsxref("Statements/for...in","for...in")}} циклов для перебора элементов массива нежелательно, потому что будут обработаны не только элементы массива, но и все перечисляемые свойства массива.</p>

<h3 id="Методы_Array">Методы Array</h3>

<p>Объект {{jsxref("Array")}} имеет следующие методы:</p>

<p>{{jsxref("Array.concat", "concat()")}} объединяет два массива и возвращает новый массив.</p>

<pre>var myArray = new Array("1", "2", "3");
myArray = myArray.concat("a", "b", "c");
// myArray = ["1", "2", "3", "a", "b", "c"]
</pre>

<p>{{jsxref("Array.join", "join(deliminator = ',')")}} объединяет элементы массива в текстовую строку.</p>

<pre>var myArray = new Array("Wind", "Rain", "Fire");
var list = myArray.join(" - "); // list = "Wind - Rain - Fire"
</pre>

<p>{{jsxref("Array.push", "push()")}} добавляет один или несколько элементов в конец массива и возвращает результирующую длину.</p>

<pre>var myArray = new Array("1", "2");
myArray.push("3"); // myArray =["1", "2", "3"]
</pre>

<p>{{jsxref("Array.pop", "pop()")}} удаляет из массива последний элемент и возвращает его.</p>

<pre>var myArray = new Array("1", "2", "3");
var last = myArray.pop();
// myArray =["1", "2"], last = "3"
</pre>

<p>{{jsxref("Array.shift", "shift()")}} удаляет из массива первый элемент и возвращает его.</p>

<pre>var myArray = new Array ("1", "2", "3");
var first = myArray.shift();
// myArray = ["2", "3"], first = "1"
</pre>

<p>{{jsxref("Array.shift", "unshift()")}} добавляет один или несколько элементов в начало массива и возвращает его новую длину.</p>

<pre class="brush: js">var myArray = new Array ("1", "2", "3");
myArray.unshift("4", "5");
// myArray becomes ["4", "5", "1", "2", "3"]</pre>

<p>{{jsxref("Array.slice", "slice(start_index, upto_index)")}} возвращает секцию массива как новый массив.</p>

<pre class="brush: js">var myArray = new Array ("a", "b", "c", "d", "e");
myArray = myArray.slice(1, 4); // начиная с индекса 1 извлекаются элементы вплоть до индекса 3
                               // myArray = [ "b", "c", "d"]
</pre>

<p>{{jsxref("Array.splice", "splice(index, count_to_remove, addElement1, addElement2, ...)")}} удаляет часть элементов из массива и (опционально) заменяет их. Возвращает удалённые элементы.</p>

<pre class="brush: js">var myArray = new Array ("1", "2", "3", "4", "5");
myArray.splice(1, 3, "a", "b", "c", "d");
// myArray = ["1", "a", "b", "c", "d", "5"]
// Этот код, начиная с ячейки под индексом 1 (в которой находилось значение "2"),
// удаляет 3 элемента, и вставляет на их место
// элементы, переданные в качестве последующих параметров.
</pre>

<p>{{jsxref("Array.reverse", "reverse()")}} переставляет элементы массива в обратном порядке: первый элемент становится последним, а последний - первым.</p>

<pre class="brush: js">var myArray = new Array ("1", "2", "3");
myArray.reverse();
// элементы переставлены myArray = [ "3", "2", "1" ]
</pre>

<p>{{jsxref("Array.sort", "sort()")}} сортирует элементы массива.</p>

<pre class="brush: js">var myArray = new Array("Wind", "Rain", "Fire");
myArray.sort();
// массив отсортирован myArray = [ "Fire", "Rain", "Wind" ]
</pre>

<p><code>Метод sort()</code> может принимать в качестве аргумента <code>callback</code>-функцию, которая определяет каким образом сравнивать элементы массива при сортировке. Функция сравнивает два значения, и возвращает одно из трех значений (список вариантов значений смотрите после примера):</p>

<p>Пример. Следующий код сортирует массив по последнему символу в строке:</p>

<pre class="brush: js">var sortFn = function(a, b){
  if (a[a.length - 1] &lt; b[b.length - 1]) return -1;
  if (a[a.length - 1] &gt; b[b.length - 1]) return 1;
  if (a[a.length - 1] == b[b.length - 1]) return 0;
}
myArray.sort(sortFn);
// массив отсортирован myArray = ["Wind","Fire","Rain"]</pre>

<ul>
 <li>если <code>a</code> меньше чем <code>b</code> в выбранной системе сравнения, возвращаем <em>-1 (или любое отрицательное число)</em></li>
 <li>если <code>a</code> больше чем <code>b</code> в выбранной системе сравнения, возвращаем <em>1 (или любое положительное число)</em></li>
 <li>если <code>a</code> и <code>b</code> считаются равными, возвращаем <em>0</em>.</li>
</ul>

<p>{{jsxref("Array.indexOf", "indexOf(searchElement[, fromIndex])")}} ищет в массиве элемент со значением <code>searchElement</code> и возвращает индекс первого совпадения.</p>

<pre class="brush: js">var a = ['a', 'b', 'a', 'b', 'a'];
console.log(a.indexOf('b')); // выводит 1
// Попробуем еще раз, начиная с индекса последнего совпадения
console.log(a.indexOf('b', 2)); // выводит 3
console.log(a.indexOf('z')); // выводит -1, потому что 'z' не найдено
</pre>

<p>{{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement[, fromIndex])")}} тоже самое, что и <code>indexOf</code>, но поиск ведется в обратном порядке, с конца массива.</p>

<pre class="brush: js">var a = ['a', 'b', 'c', 'd', 'a', 'b'];
console.log(a.lastIndexOf('b')); // выводит 5
// Попробуем еще раз, начиная с индекса, предшествующего индексу последнего совпадения
console.log(a.lastIndexOf('b', 4)); // выводит 1
console.log(a.lastIndexOf('z')); // выводит -1
</pre>

<p>{{jsxref("Array.forEach", "forEach(callback[, thisObject])")}} выполняет <code>callback</code>-функцию по каждому элементу массива.</p>

<pre class="brush: js">var a = ['a', 'b', 'c'];
a.forEach(function(element) { console.log(element);} );
// выводит в консоль каждый элемент массива по порядку
</pre>

<p>{{jsxref("Array.map", "map(callback[, thisObject])")}} возвращает новый массив, содержащий результаты вызова <code>callback</code>-функции для каждого элемента исходного массива.</p>

<pre class="brush: js">var a1 = ['a', 'b', 'c'];
var a2 = a1.map(function(item) { return item.toUpperCase(); });
console.log(a2); // выводит A,B,C
</pre>

<p>{{jsxref("Array.filter", "filter(callback[, thisObject])")}} возвращает новый массив, содержащий только те элементы исходного массива, для которых вызов <code>callback</code>-функции вернул true.</p>

<pre class="brush: js">var a1 = ['a', 10, 'b', 20, 'c', 30];
var a2 = a1.filter(function(item) { return typeof item == 'number'; });
console.log(a2); // выводит 10,20,30
</pre>

<p>{{jsxref("Array.every", "every(callback[, thisObject])")}} возвращает true, если вызов <code>callback</code>-функции вернул  true для всех элементов массива.</p>

<pre class="brush: js">function isNumber(value){
  return typeof value == 'number';
}
var a1 = [1, 2, 3];
console.log(a1.every(isNumber)); // выводит true
var a2 = [1, '2', 3];
console.log(a2.every(isNumber)); // выводит false
</pre>

<p>{{jsxref("Array.some", "some(callback[, thisObject])")}} возвращает true, если вызов <code>callback</code>-функции вернет true хотя бы для одного элемента.</p>

<pre class="brush: js">function isNumber(value){
  return typeof value == 'number';
}
var a1 = [1, 2, 3];
console.log(a1.some(isNumber)); // выводит true
var a2 = [1, '2', 3];
console.log(a2.some(isNumber)); // выводит true
var a3 = ['1', '2', '3'];
console.log(a3.some(isNumber)); // выводит false
</pre>

<p>Те из методов выше, что принимают <code>callback</code>-функцию в качестве аргумента, известны как методы итерации (<em>iterative methods)</em>, потому что определенным образом проходятся по всем элементам массива. Каждый из таких методов принимает второй, опциональный элемент, называемый <code>thisObject</code>. Если этот аргумент присутствует, то его значение присваивается ключевому слову <code>this</code> в теле <code>callback</code>-функции. Иначе, как и в любом другом случае вызова функции вне явного контекста, <code>this</code> будет ссылаться на глобальный объект ({{domxref("window")}}).</p>

<p>В действительности <code>callback</code>-функция вызывается с тремя аргументами. Первый аргумент - текущий элемент массива, второй - индекс этого элемента, и третий - ссылка на сам массив. Однако, в JavaScript, функции игнорируют любые аргументы, которые не перечислены в списке аргументов. Таким образом, нет ничего страшного в использовании функции с одним аргументом, такой как <code>alert</code>.</p>

<p>{{jsxref("Array.reduce", "reduce(callback[, initialValue])")}} последовательно применяет <code>callback</code>-функцию <code>callback(firstValue, secondValue)</code> для того, чтобы свести все элементы массива к одному значению. В первый параметр функции передаётся предыдущий результат работы функции или первый элемент, а во второй - текущий элемент. Третьим параметром передаётся индекс текущего элемента.</p>

<pre class="brush: js">var a = [10, 20, 30];
var total = a.reduce(function(first, second, index) { return first + second; }, 0);
console.log(total) // выводит 60
</pre>

<p>{{jsxref("Array.reduceRight", "reduceRight(callback[, initalvalue])")}} работает так же как и <code>reduce()</code>, но порядок обхода ведется от конца к началу.</p>

<p><code>Методы reduce</code> и <code>reduceRight</code> являются наименее очевидными методами объекта Array. Они должны использоваться в алгоритмах, которые рекурсивно совмещают два элемента массива, для сведения всей последовательности к одному значению.</p>

<h3 id="Многомерные_массивы">Многомерные массивы</h3>

<p>Массивы могут быть вложенными, то есть массив может содержать массивы в элементах. Используя эту возможность массивов JavaScript, можно построить многомерные массивы.</p>

<p>Следующий код создает двумерный массив:</p>

<pre class="brush: js">var a = new Array(4);
for (i = 0; i &lt; 4; i++) {
  a[i] = new Array(4);
  for (j = 0; j &lt; 4; j++) {
    a[i][j] = "[" + i + "," + j + "]";
  }
}
</pre>

<p>В этом примере создается массив со следующим содержимым:</p>

<pre>Ряд 0: [0,0] [0,1] [0,2] [0,3]
Ряд 1: [1,0] [1,1] [1,2] [1,3]
Ряд 2: [2,0] [2,1] [2,2] [2,3]
Ряд 3: [3,0] [3,1] [3,2] [3,3]
</pre>

<h3 id="Массивы_и_регулярные_выражения">Массивы и регулярные выражения</h3>

<p>Когда массив является результатом вычислений регулярного выражения над строкой, он содержит свойства и элементы с информацией о совпадениях. Массив возвращается функциями  {{jsxref("Global_Objects/RegExp/exec","RegExp.exec()")}}, {{jsxref("Global_Objects/String/match","String.match()")}} и  {{jsxref("Global_Objects/String/split","String.split()")}} Подробнее о том, как использовать массивы с регулярными выражениями смотрите в <a href="/en-US/docs/Web/JavaScript/Guide/Regular_Expressions" title="en-US/docs/JavaScript/Guide/Regular Expressions">Regular Expressions</a>.</p>

<h3 id="Работа_с_массивоподобными_объектами">Работа с массивоподобными объектами</h3>

<p>Некоторые объекты в JavaScript, такие как {{domxref("NodeList")}}, возвращаемые методом {{domxref("document.getElementsByTagName()")}}, или специальный объект  {{jsxref("Functions/arguments","arguments")}}, доступный внутри функции, выглядят и ведут себя как обычные массивы, однако не имеет всех присущих массиву методов. Так например, объект <code>arguments</code> имеет свойство {{jsxref("Global_Objects/Function/length","length")}}, но не имеет метода {{jsxref("Array.forEach", "forEach()")}}.</p>

<p>Методы из прототипа Array, могут быть вызваны для массивоподобных объектов. Например:</p>

<pre><code>function printArguments() {
  Array.prototype.forEach.call(arguments, function(item) {
    console.log(item);
  });
}</code></pre>

<p>Также методы из прототипа Array могут быть применены и к строкам, потому как строки предоставляют доступ к своим символам сходным образом:</p>

<pre class="brush: js"><code>Array.prototype.forEach.call</code>("a string", function(chr) {
  console.log(chr);
});</pre>

<h2 id="Типизированные_массивы">Типизированные массивы</h2>

<p><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a> (типизированные массивы) являются массивоподобными объектами, которые предоставляют механизм доступа к сырым бинарным данным. Как вы уже знаете, {{jsxref("Array")}} массивы динамически растут, сокращаются и могут содержать значения любых типов JavaScript. Движки JavaScript производят оптимизации, благодаря чему, эти операции происходят быстро. Однако, веб приложения становятся все более мощными, добавляются возможности манипуляции со звуковыми и видеоданными, доступ к сырым данным <a href="/en-US/docs/WebSockets">WebSockets</a>, и тому подобное. Становится очевидным, что возможность быстрой и эффективной работы с двоичными данными в JavaScript будет очень полезной. Для чего типизированные массивы и предназначены.</p>

<h3 id="Буферы_и_представления_архитектура_типизированных_массивов">Буферы и представления: архитектура типизированных массивов</h3>

<p>Для достижения максимальной гибкости и производительности, реализация типизированных массивов в JavaScript разделена на <strong>буферы</strong> и <strong>представления</strong>. Буфер ({{jsxref("ArrayBuffer")}}) это объект, представляющий из себя блок данных; он не имеет формата и не предоставляет возможности доступа к своему содержимому. Для доступа к памяти буфера вам нужно использовать представление. Представление являет собой контекст, имеющий тип данных, начальную позицию в буфере, и количество элементов — это позволяет представить данные в виде актуального типизированного массива.</p>

<p><img alt="Typed arrays in an ArrayBuffer" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p>

<h3 id="ArrayBuffer">ArrayBuffer</h3>

<p>Объект {{jsxref("ArrayBuffer")}} это стандартный набор бинарных данных с фиксированной длиной. Вы не можете манипулировать содержимым <code>ArrayBuffer</code> напрямую. Вместо этого необходимо создать типизированное представление {{jsxref("DataView")}}, которое будет отображать буфер в определенном формате, и даст доступ на запись и чтение его содержимого.</p>

<h3 id="Типизированные_представления">Типизированные представления</h3>

<p>Название типизированного представления массива говорит само за себя. Оно представляет массив в распространенных числовых форматах, таких как  <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> и так далее. Среди прочих существует специальное представление <code>Uint8ClampedArray</code>. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при <a href="/en-US/docs/Web/API/ImageData">Обработке данных изображения в Canvas</a>.</p>

<p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "TypedArray_objects")}}</p>

<p>Для получения подробных сведений смотрите <a href="/en-US/docs/Web/JavaScript/Typed_arrays">Типизированные массивы JavaScript</a> и справочную документацию для  {{jsxref("TypedArray")}}.</p>

<p>{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}</p>