Что такое массивы?

Массивы — это структура данных, в которой хранится упорядоченная коллекция элементов. В JavaScript массивы классифицируются как объекты особого типа и могут хранить числа, строки, объекты или другие массивы. Элементы массива заключаются в квадратные скобки [] и используют индекс, отсчитываемый от нуля. Индекс, начинающийся с нуля, означает, что первый элемент массива будет иметь индекс 0, второй элемент будет иметь индекс 1 и так далее.

const names = ["David", "Hannah", "William"];
console.log(names[0]); // returns the first element
// returns "David"
console.log(names[1]); // returns the second element
// returns "Hannah"
console.log(names[2]); // returns the third element
// returns "William"

Как можно изменять или манипулировать массивами?

Индекс элемента в массиве

Новый элемент можно добавить в массив, присвоив значение пустому индексу.

names[3] = "Eric";
console.log(names);
// returns ["David", "Hannah", "William", "Eric"]

Элементы массива можно изменить, переназначив новое значение существующему индексу.

names[1] = "Juniper";
console.log(names);
// returns ["David", "Juniper", "William", "Eric"]

Методы массива

Массивы также можно изменять или манипулировать ими с помощью таких методов массива, как «push», «pop», «unshift», «shift», «slice» и «splice».

'толкать()'

Метод push принимает один или несколько элементов в качестве аргументов, добавляет элементы в конец массива и возвращает длину измененного массива.

names.push("Bob");
// returns 5 
console.log(names);
// returns ["David", "Juniper", "William", "Eric", "Bob"]

'поп()'

Метод pop не принимает аргументов, удаляет последний элемент массива и возвращает удаленный элемент.

names.pop();
// returns "Bob"
console.log(names);
// returns ["David", "Juniper", "William", "Eric"]

'отменить сдвиг()'

Метод unshift принимает один или несколько элементов в качестве аргументов, добавляет элементы в начало массива и возвращает длину измененного массива.

names.unshift("Jack", "Jane");
// returns 6
console.log(names);
// returns ["Jack", "Jane", "David", "Juniper", "William", "Eric"]

'сдвиг()'

Метод 'shift' не принимает аргументов, удаляет первый элемент массива и возвращает удаленный элемент.

names.shift();
// returns "Jack"
console.log(names);
// returns ["Jane", "David", "Juniper", "William", "Eric"]

'срез()'

Метод 'slice' принимает два необязательных аргумента (startIndex, endIndex) и возвращает новый массив с элементами от startIndex до endIndex исходного массива, но не включая его.
Если startIndex опущен, используется 0.
Если endIndex опущен, используется длина массива. Отрицательные индексные числа можно использовать для обратного отсчета от конца массива.

names.slice(1, 3);
// returns ["David", "Juniper"]
names.slice(3);
// returns ["Juniper", "William", "Eric"]
names.slice(-2, 1);
// returns ["William", "Eric", "Jane"]
names.slice();
// returns ["Jane", "David", "Juniper", "William", "Eric"]

'сращивание()'

Метод splice принимает один или несколько аргументов (startIndex, deleteCount, element1, element2, ...) и возвращает новый массив, содержащий все удаленные элементы. Из startIndex удаляется количество элементов deleteCount, и следующие аргументы элемента будут добавлены в массив, начиная с startIndex. Если параметр deleteCount опущен, удаляются все элементы от startIndex до конца массива. Если аргументы элемента опущены, элементы не добавляются.

names.splice(0, 1, "Joe", "Alex"); 
// returns ["Jane"]
console.log(names);
// returns ["Joe", "Alex", "David", "Juniper", "William", "Eric"]
names.splice(1, 4);
// returns ["Alex", "David", "Juniper", "William"]
console.log(names);
// returns ["Joe", "Eric"]
names.splice(0, 0, "Bob", "Frank", "Maria")
// returns []
console.log(names);
// returns ["Joe", "Bob", "Frank", "Maria", "Eric"]

Поскольку методы push, pop, unshift, shift и splice изменяют исходный массив, они классифицируются как деструктивные методы. Метод Slice оставляет исходный массив нетронутым, поэтому он классифицируется как неразрушающий.

Оператор распространения '...'

Чтобы неразрушающим образом добавлять элементы в массив или копировать его, можно использовать оператор расширения. Оператор распространения распределяет массив на его элементы.

const array = [1, 2, 3];
const newArray = [0, ...array, 4, 5];
// ...array spreads [1, 2, 3] into 1, 2, 3
console.log(newArray);
// returns [1, 2, 3, 4, 5]

Без оператора расширения исходный массив был бы вложен в новый массив.

const array = [1, 2, 3];
const newArray = [0, array, 4, 5];
console.log(newArray);
// returns [0, [1, 2, 3], 4, 5];

Итерационные методы массивов

Итеративные методы массива вызывают предоставленную функцию для каждого элемента массива и возвращают значение или новый массив. Предоставленная функция вызывается с тремя аргументами: текущий элемент, индекс текущего элемента и исходный массив, для которого был вызван метод.

function callbackFunction (currentElement, currentIndex, originalArray) {
// function body
}

Некоторые примеры итеративных методов работы с массивами: «найти», «фильтровать», «картировать» и «сократить».

'находить()'

Метод find принимает функцию в качестве аргумента и возвращает первый элемент массива, удовлетворяющий условиям функции.

const numbers = [5, 10, 15, 20, 25];
numbers.find(number => number > 15);
// returns 20;

'фильтр()'

Метод filter аналогичен методу find, но вместо этого возвращает массив всех элементов, удовлетворяющих условиям данной функции.

const numbers = [5, 10, 15, 20, 25];
numbers.filter(number => number > 15);
// returns [20, 25];

'карта()'

Метод 'map' возвращает новый массив с результатами вызова функции для каждого элемента исходного массива.

const numbers = [1, 2, 3, 4, 5];
numbers.map(number => number * number);
// returns [1, 4, 9, 16, 25]

'уменьшать()'

Метод «reduce» принимает в качестве аргумента функцию и начальное значение. Предоставленная функция получает четыре аргумента: аккумулятор, текущее значение, текущий индекс и исходный массив. Предоставленное начальное значение — это значение аккумулятора для первого элемента массива. Результат функции для каждого элемента используется как значение аккумулятора для следующего элемента массива. Если начальное значение не указано, аккумулятору присваивается первый элемент массива, а функция обратного вызова вызывается, начиная со второго элемента.

const numbers = [1, 2, 3, 4, 5]
numbers.reduce(((acc, number) => acc   number), 0);
// returns 15