15 Важных методов массива в JavaScript

Для работы с наборами данных в JavaScript используются массивы (array). Массивы имеют встроенные свойства и методы, которые позволяют удалять, добавлять и сортировать элементы, а также выполнять другие манипуляции. Хорошее знание методов массивов значительно повышает уровень профессионализма веб-разработчика.

В этой статье мы рассмотрим 15 методов, которые помогут вам эффективно работать с данными в массивах.

Содержание

Содержание
Примеры использования методов
некоторые ()
уменьшить()
every()
map()
flat()
фильтр()
forEach()
findIndex()
найти()
сортировка()
concat()
fill()
включает в себя ()
reverse()
flatMap()
Заключение

Содержание

some()
reduce()
every()
map()
flat()
filter()
forEach()
findIndex()
find()
sort()
concat()
fill()
includes()
reverse()
flatMap()

Примеры использования методов

некоторые ()

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

const myAwesomeArray = ["a", "b", "c", "d", "e"];
console.log(myAwesomeArray.some(test => test === "d")); // true

уменьшить()

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

const myAwesomeArray = [1, 2, 3, 4, 5];
console.log(myAwesomeArray.reduce((total, value) => total * value)); // 120

every()

Метод every() проверяет, удовлетворяют ли все элементы массива условиям функции. Возвращает true, если все элементы соответствуют условиям, иначе false.

const myAwesomeArray = ["a", "b", "c", "d", "e"];
console.log(myAwesomeArray.every(test => test === "d")); // false

const myAwesomeArray2 = ["a", "a", "a", "a", "a"];
console.log(myAwesomeArray2.every(test => test === "a")); // true

map()

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

const myAwesomeArray = [5, 4, 3, 2, 1];
console.log(myAwesomeArray.map(x => x * x)); // [25, 16, 9, 4, 1]

flat()

Метод flat() создает новый массив, содержащий элементы вложенных массивов.

const myAwesomeArray = [[1, 2], [3, 4], 5];
console.log(myAwesomeArray.flat()); // [1, 2, 3, 4, 5]

фильтр()

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

const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
{ id: 4, name: "Mass" },
];
console.log(myAwesomeArray.filter(element => element.name === "Mass"));
// [{ id: 3, name: "Mass" }, { id: 4, name: "Mass" }]

forEach()

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

const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
];
myAwesomeArray.forEach(element => console.log(element.name));
// john
// Ali
// Mass

findIndex()

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

const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
];
console.log(myAwesomeArray.findIndex(element => element.id === 3)); // 2
console.log(myAwesomeArray.findIndex(element => element.id === 7)); // -1

найти()

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

const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
];
console.log(myAwesomeArray.find(element => element.id === 3)); // { id: 3, name: "Mass" }
console.log(myAwesomeArray.find(element => element.id === 7)); // undefined

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

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

const myAwesomeArray = [5, 4, 3, 2, 1];
myAwesomeArray.sort((a, b) => a - b); // [1, 2, 3, 4, 5]
myAwesomeArray.sort((a, b) => b - a); // [5, 4, 3, 2, 1]

concat()

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

const myAwesomeArray = [1, 2, 3, 4, 5];
const myAwesomeArray2 = [10, 20, 30, 40, 50];
console.log(myAwesomeArray.concat(myAwesomeArray2)); // [1, 2, 3, 4, 5, 10, 20, 30, 40, 50]

fill()

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

const myAwesomeArray = [1, 2, 3, 4, 5];
myAwesomeArray.fill(0, 1, 3); // [1, 0, 0, 4, 5]

включает в себя ()

Метод includes() проверяет, содержит ли массив определенный элемент. Возвращает true или false.

const myAwesomeArray = [1, 2, 3, 4, 5];
console.log(myAwesomeArray.includes(3)); // true
console.log(myAwesomeArray.includes(8)); // false

reverse()

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

const myAwesomeArray = ["e", "d", "c", "b", "a"];
myAwesomeArray.reverse(); // ['a', 'b', 'c', 'd', 'e']

flatMap()

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

const myAwesomeArray = [[1], [2], [3], [4], [5]];
console.log(myAwesomeArray.flatMap(arr => arr * 10)); // [10, 20, 30, 40, 50]

// With .flat() and .map()
console.log(myAwesomeArray.flat().map(arr => arr * 10)); // [10, 20, 30, 40, 50]

Заключение

Знание и использование этих методов позволяет эффективно работать с массивами в JavaScript, улучшая производительность и удобочитаемость вашего кода. Экспериментируйте с этими методами, чтобы увидеть, как они могут улучшить ваши проекты.