Массивы — одна из самых фундаментальных структур данных в JavaScript. С помощью массива вы можете хранить несколько значений в одной переменной. JavaScript предоставляет множество встроенных методов для управления массивами, что делает их невероятно универсальными. В этом посте мы рассмотрим все встроенные методы массивов и способы их эффективного использования в ваших проектах JavaScript.

Основные методы

forEach()

Метод forEach() позволяет перебирать массив и выполнять предоставленную функцию один раз для каждого элемента массива. Это простой способ пройтись по массиву.

const array = [1, 2, 3, 4, 5];

array.forEach((element) => {
  console.log(element);
});

карта()

Метод map() создает новый массив, заполняемый результатами вызова предоставленной функции для каждого элемента массива. Обычно он используется для преобразования данных.

const array = [1, 2, 3, 4, 5];

const doubled = array.map((element) => element * 2);

console.log(doubled); // [2, 4, 6, 8, 10]

фильтр()

Метод filter() создает новый массив со всеми элементами, прошедшими проверку, реализованную предоставленной функцией. Это полезно, когда вам нужно отфильтровать определенные элементы из массива на основе условия.

const array = [1, 2, 3, 4, 5];

const evenNumbers = array.filter((element) => element % 2 === 0);

console.log(evenNumbers); // [2, 4]

уменьшать()

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

const array = [1, 2, 3, 4, 5];

const sum = array.reduce((accumulator, currentValue) => accumulator   currentValue, 0);

console.log(sum); // 15

находить()

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

const array = [1, 2, 3, 4, 5];

const found = array.find((element) => element > 3);

console.log(found); // 4

найтиИндекс()

Метод findIndex() возвращает индекс первого элемента массива, который удовлетворяет предоставленной функции тестирования. Если ни один элемент не удовлетворяет функции тестирования, она возвращает -1.

const array = [1, 2, 3, 4, 5];

const index = array.findIndex((element) => element > 3);

console.log(index); // 3

сортировка()

Метод sort() сортирует элементы массива по месту и возвращает отсортированный массив. Обычно он используется для сортировки строк и чисел, но для правильной сортировки чисел может потребоваться функция сравнения.

const array = [5, 3, 8, 1, 2];

const sortedArray = array.sort((a, b) => a - b);

console.log(sortedArray); // [1, 2, 3, 5, 8]

обеспечить регресс()

Методverse() меняет местами элементы массива. Первый элемент массива становится последним, а последний — первым.

const array = [1, 2, 3, 4, 5];

const reversedArray = array.reverse();

console.log(reversedArray); // [5, 4, 3, 2, 1]

конкат()

Метод concat() используется для объединения двух или более массивов. Он возвращает новый массив, оставляя исходные массивы без изменений.

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];

const concatenatedArray = array1.concat(array2);

console.log(concatenatedArray); // [1, 2, 3, 4, 5, 6]

срез()

Метод среза() возвращает неглубокую копию части массива в новый объект массива, выбранный от начала до конца (конец не включен).

const array = [1, 2, 3, 4, 5];

const slicedArray = array.slice(1, 4);

console.log(slicedArray); // [2, 3, 4]

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

Метод splice() изменяет содержимое массива, удаляя, заменяя или добавляя элементы.

const array = [1, 2, 3, 4, 5];

array.splice(2, 1, 6, 7);

console.log(array); // [1, 2, 6, 7, 4, 5]

толкать()

Метод push() добавляет один или несколько элементов в конец массива и возвращает новую длину массива.

const array = [1, 2, 3];

array.push(4, 5);

console.log(array); // [1, 2, 3, 4, 5]

поп()

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

const array = [1, 2, 3, 4, 5];

const lastElement = array.pop();

console.log(lastElement); // 5
console.log(array); // [1, 2, 3, 4]

сдвиг()

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

const array = [1, 2, 3, 4, 5];

const firstElement = array.shift();

console.log(firstElement); // 1
console.log(array); // [2, 3, 4, 5]

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

Метод unshift() добавляет один или несколько элементов в начало массива и возвращает новую длину массива.

const array = [2, 3, 4, 5];

array.unshift(1);

console.log(array); // [1, 2, 3, 4, 5]

присоединиться()

Метод join() создает и возвращает новую строку путем объединения всех элементов массива, разделенных запятыми или указанной строкой-разделителем.

const array = [1, 2, 3, 4, 5];

const joinedString = array.join('-');

console.log(joinedString); // "1-2-3-4-5"

Дополнительные методы

каждый()

Метод Every() проверяет, все ли элементы массива соответствуют предоставленной тестовой функции.

const array = [2, 4, 6, 8];

const allEven = array.every((element) => element % 2 === 0);

console.log(allEven); // true

некоторый()

Метод some() проверяет, соответствует ли хотя бы один элемент массива предоставленной тестовой функции.

const array = [1, 2, 3, 4, 5];

const hasEven = array.some((element) => element % 2 === 0);

console.log(hasEven); // true

плоский()

Метод Flat() создает новый массив, в который рекурсивно объединяются все элементы подмассива до указанной глубины.

const array = [1, [2, [3, [4]]]];

const flattenedArray = array.flat(2);

console.log(flattenedArray); // [1, 2, 3, [4]]

плоская карта()

Метод FlatMap() сначала отображает каждый элемент с помощью функции сопоставления, а затем сглаживает результат в новый массив. Это комбинация Map() и Flat().

const array = [1, 2, 3, 4];

const flattened = array.flatMap((num) => [num, num * 2]);

console.log(flattened); // [1, 2, 2, 4, 3, 6, 4, 8]

наполнять()

Метод fill() заполняет все элементы массива статическим значением от начального индекса до конечного индекса.

const array = [1, 2, 3, 4, 5];

array.fill(0, 2, 4);

console.log(array); // [1, 2, 0, 0, 5]

копироватьВнутри()

Метод copyWithin() неглубоко копирует часть массива в другое место в том же массиве, не изменяя его длину.

const array = [1, 2, 3, 4, 5];

array.copyWithin(0, 3, 5);

console.log(array); // [4, 5, 3, 4, 5]

включает()

Метод include() проверяет, содержит ли массив определенное значение.

const array = [1, 2, 3, 4, 5];

const hasThree =

 array.includes(3);

console.log(hasThree); // true

toString()

Метод toString() преобразует массив в строку, разделенную запятыми.

const array = [1, 2, 3, 4, 5];

const arrayString = array.toString();

console.log(arrayString); // "1,2,3,4,5"

индексОф()

Метод indexOf() возвращает первый индекс, по которому данный элемент может быть найден в массиве, или -1, если он отсутствует.

const array = [1, 2, 3, 4, 5];

const index = array.indexOf(3);

console.log(index); // 2

последнийиндексоф()

Метод LastIndexOf() возвращает последний индекс, по которому данный элемент может быть найден в массиве, или -1, если он отсутствует.

const array = [1, 2, 3, 4, 3, 5];

const lastIndex = array.lastIndexOf(3);

console.log(lastIndex); // 4

от()

Метод Array.from() создает новый экземпляр массива из массивоподобного или итерируемого объекта.

const array = Array.from('hello');

console.log(array); // ['h', 'e', 'l', 'l', 'o']

isArray()

Метод Array.isArray() проверяет, является ли переданное значение массивом.

const array = [1, 2, 3, 4, 5];
const notArray = { a: 1, b: 2 };

console.log(Array.isArray(array)); // true
console.log(Array.isArray(notArray)); // false

из()

Метод Array.of() создает новый экземпляр массива с переменным количеством элементов.

const array1 = Array.of(1, 2, 3);
const array2 = Array.of('a', 'b', 'c');

console.log(array1); // [1, 2, 3]
console.log(array2); // ['a', 'b', 'c']

Заключение

Массивы JavaScript имеют широкий набор встроенных методов, позволяющих эффективно манипулировать данными. Понимание этих методов позволит вам более эффективно писать чистый и лаконичный код. Потратьте некоторое время, чтобы поэкспериментировать с этими методами и посмотреть, как они могут улучшить ваш код.
Первоначально опубликовано: Руководство по методам массивов JavaScript