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

Объект Array имеет множество методов, которые помогают разработчикам легко и эффективно обрабатывать массивы. И даже изучение основ может значительно улучшить читаемость вашего кода. Здесь мы собираемся узнать о некоторых из них, работая над ниже, работая над ниже. пример.

Здесь у нас есть два массива компаний и возрастов. У компаний есть несколько объектов с названием, категорией, началом и концом, а возраст имеет числовой возраст людей. Мы будем делать примеры, взяв их за основу.

для каждого():

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

Итак, давайте сначала попробуем зарегистрировать все элементы внутри массива компаний с помощью цикла for.

for (let i = 0; i < companies.length; i++) {
 console.log(companies[i]);
}

Теперь давайте попробуем это с методом forEach(), который будет делать то же самое.

companies.forEach(company => console.log(company));

Если нам нужны только имена вместо полного объекта, мы можем консольный журнал company.name .

фильтр():

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

Если мы хотим отфильтровать возраст, превышающий 21 год, мы можем использовать этот метод. Давайте сначала сделаем это с циклом for.

let canDrink = [];
for (let i = 0; i < ages.length; i++) {
 if (ages[i] >= 21) {
  canDrink.push(ages[i]);
 }
};
console.log(canDrink);

Здесь мы используем цикл for для перебора каждого элемента и проверки, меньше ли он или равен 21, и если это правда, элемент помещается в новый пустой массив canDrink.

То же самое можно легко сделать с помощью метода filter().

let canDrink = ages.filter(age => age >= 21);
console.log(canDrink);

Здесь мы используем этот метод для создания нового массива canDrink с нашими необходимыми данными. Он перебирает каждый элемент и проверяет, меньше ли число 21 или равно ему, и если да, то сохраняет значение в новом массиве canDrink , который можно увидеть после console.log(canDrink).

карта():

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

map() работает немного иначе, чем filter(), и мы можем создать массив того же размера из нашего текущего массива вместо фильтрации.

Давайте создадим новый массив только из названий компаний.

let companyName = companies.map(company => company.name);
console.log(companyName);

И все, здесь мы создаем массив только названий компаний с помощью одной строки кода с помощью этого метода.

Давайте сделаем еще один пример, в котором мы создадим массив названий компаний с их годом начала и окончания.

let companyDetails = companies.map(company => `${company.name} [${company.start} - ${company.end}]`);
console.log(companyDetails);

сортировать():

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

const sortedCompanies = companies.sort((c1, c2) => c1.start - c2.start);
console.log(sortedCompanies);

Здесь мы просто сравниваем значения c1.start и c2.start и сортируем массив в порядке возрастания.

Давайте посмотрим на другой пример, где мы будем сортировать возраст в порядке возрастания.

let sortAges = ages.sort((a1, a2) => a1 - a2);
console.log(sortAges);

Приведенный выше код будет делать то же самое, что и sortedCompanies, сравнивать две переменные и создавать массив sortAges в возрастающем порядке.

уменьшить():

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

Итак, давайте продолжим и получим сумму возрастов массива, используя метод reduce().

let ageSum = ages.reduce((total, age) => total + age, 0);
console.log(ageSum);

Здесь сумма инициализируется нулем, и все элементы добавляются к сумме один за другим, чтобы получить сумму всех элементов из массива ages.

Давайте снова воспользуемся reduce(), чтобы получить сумму всех лет компаний.

let sumYears = companies.reduce((total, company) => total + (company.end - company.start), 0);
console.log(sumYears);

И это даст нам общее количество лет по мере необходимости.

Обратите внимание, что мы также можем объединять/объединять методы в соответствии с нашими требованиями.