Рубрики
Без рубрики

Метод уменьшения массива в JavaScript

Изучение метода уменьшения массива в JavaScript. Tagged с массивом, JavaScript, уменьшите.

Уменьшение – это метод на прототипе объекта массива JavaScript. Посмотрим, как это на самом деле работает.

Метод уменьшения массива выполняет функцию обратного вызова на каждом элементе массива и дает одно выходное значение.



```javascript
const myArray = [1, 2, 3, 4];
const summer = (accumulator, current, currentIndex, sourceArray) => accumulator + current; 
console.log(myArray.reduce(summer, 0)); // 10 
```


В приведенном выше примере лето Функция называется редуктором. На каждой итерации функции редуктора мы итерации по текущему значению и добавляем ее к значению аккумулятора, возвращаемому в последней итерации.

Функция Reducer принимает 4 параметра: * Значение аккумулятора, которое является результатом операции в теле редуктора из последней итерации или начального значения в первой итерации * Текущее значение – текущее элемент, над которым мы Итерация * Текущий индекс – текущий индекс элемента, который мы итерации по сравнению с массивом источника – массив, который мы переживаем.

Давайте теперь посмотрим на пользовательскую реализацию функции Marray Cream.



```javascript
1. function reduce(reducer, initialValue, array) {
2.    let accumulator = initialValue;
3.    for(const item of array) {
4.        accumulator = reducer(accumulator, item);
5.    }
6.    return accumulator;
7. }
```


Объяснение: В строке 2 мы присваиваем значение начального значения аккумулятору. Мы перечитываем массив в строке № 3, и в строке 4 мы называем функцию редуктора, передаваемую в значении аккумулятора и текущем элементе, который мы итерации. Значение аккумулятора в строке 4 на RHS является начальным значением в первой итерации, и в последующих итерациях это выходное значение вызова редуктора по предыдущему значению аккумулятора и предыдущего итерационного элемента. После того, как мы закончим с итерацией над массивом, мы возвращаем значение аккумулятора в строке 6.

Некоторые варианты использования метода уменьшения массива указаны ниже:



```javascript
/*
 * Problem one
 * Turn an array of numbers into a long string of all those numbers
 */

const myArray2 = [1, 2, 3];
const stringifiedArray = myArray2.reduce((a, b) => a + b, '');

console.log(stringifiedArray); // 123
```




```javascript
/*
 * Problem two
 * Turn an array of voter objects into a count of how many people voted
 */

const voters = [
    {name:'Bob' , age: 30, voted: true},
    {name:'Jake' , age: 32, voted: true},
    {name:'Kate' , age: 25, voted: false},
    {name:'Sam' , age: 20, voted: false},
    {name:'Phil' , age: 21, voted: true},
    {name:'Ed' , age:55, voted:true},
    {name:'Tami' , age: 54, voted:true},
    {name: 'Mary', age: 31, voted: false},
    {name: 'Becky', age: 43, voted: false},
    {name: 'Joey', age: 41, voted: true},
    {name: 'Jeff', age: 30, voted: true},
    {name: 'Zack', age: 19, voted: false}
];

const totalVotes = (inVoters) => {
  const votedUsersArray = inVoters.reduce((a, b) => a + (b.voted ? 1 : 0), 0);
  return votedUsersArray;
};

console.log(totalVotes(voters)); // 7
```




```javascript
/*
 * Problem three
 * Given an array of all your wishlist items, figure out how much it would cost to just buy everything at once
 */

const wishlist = [
  { title: "Tesla Model S", price: 90000 },
  { title: "4 carat diamond ring", price: 45000 },
  { title: "Fancy hacky Sack", price: 5 },
  { title: "Gold fidgit spinner", price: 2000 },
  { title: "A second Tesla Model S", price: 90000 }
];

const shoppingSpree = (inWishlist) => {
  const totalCost = inWishlist.reduce((a, b) => {
    return a + b.price
  }, 0);
  return totalCost;
}

console.log(shoppingSpree(wishlist)); // 227005
```




```javascript
/*
 * Problem four
 * Given an array of arrays, flatten them into a single array
 */

var arrays = [
  ["1", "2", "3"],
  [true],
  [4, 5, 6]
];

const flatten = (inArrays) => inArrays.reduce((a, b) => a.concat(b), []);

console.log(flatten(arrays)); // ['1', '2', '3', true, 4, 5, 6]
```




```javascript
/*
 * Problem five
 * Given an array of potential voters, return an object representing the results of the vote
 * Include how many of the potential voters were in the ages 18-25, how many from 26-35, how many from 36-55, and how many of each of those age ranges actually voted. The resulting object containing this data * should have 6 properties. See the example output at the bottom.
 */

const voters2 = [
  {name:'Bob' , age: 30, voted: true},
  {name:'Jake' , age: 32, voted: true},
  {name:'Kate' , age: 25, voted: false},
  {name:'Sam' , age: 20, voted: false},
  {name:'Phil' , age: 21, voted: true},
  {name:'Ed' , age:55, voted:true},
  {name:'Tami' , age: 54, voted:true},
  {name: 'Mary', age: 31, voted: false},
  {name: 'Becky', age: 43, voted: false},
  {name: 'Joey', age: 41, voted: true},
  {name: 'Jeff', age: 30, voted: true},
  {name: 'Zack', age: 19, voted: false}
];

const voterResults = (inVoters) => {
  const reducedObject = inVoters.reduce((a, b) => {
    if(b.age >= 18 && b.age <= 25 && b.voted) {
      a.numYoungVotes++;
    }
    if(b.age >= 18 && b.age <= 25) {
      a.numYoungPeople++;
    }
    if(b.age >= 26 && b.age <= 35 && b.voted) {
      a.numMidVotesPeople++;
    }
    if(b.age >= 26 && b.age <= 35) {
      a.numMidsPeople++;
    }
    if(b.age >= 36 && b.age <= 55 && b.voted) {
      a.numOldVotesPeople++;
    }
    if(b.age >= 36 && b.age <= 55) {
      a.numOldsPeople++;
    }
    return {...a};
  }, {
    numYoungVotes: 0,
    numYoungPeople: 0,
    numMidVotesPeople: 0,
    numMidsPeople: 0,
    numOldVotesPeople: 0,
    numOldsPeople: 0
  });
  return reducedObject;
};

console.log(voterResults(voters2)); // Returned value shown below:
/*
{ numYoungVotes: 1,
  numYoungPeople: 4,
  numMidVotesPeople: 3,
  numMidsPeople: 4,
  numOldVotesPeople: 3,
  numOldsPeople: 4
}
*/
```




```javascript
/*
 * Problem six
 * Return an object where each property is the name of the an ice cream flavour and each value is an integer that is the total count of that flavour.
 * Store the returned data in a new iceCreamTotals variable.
 */

const data = [
  { name: 'Superman', favoriteIceCreams: ['Strawberry', 'Vanilla', 'Chocolate', 'Cookies & Cream'] },
  { name: 'Batman', favoriteIceCreams: ['Cookies & Cream', 'Mint Chocolate Chip', 'Chocolate', 'Vanilla'] },
  { name: 'Flash', favoriteIceCreams: ['Chocolate', 'Rocky Road', 'Pistachio', 'Banana'] },
  { name: 'Aquaman', favoriteIceCreams: ['Vanilla', 'Chocolate', 'Mint Chocolate Chip'] },
  { name: 'Green Lantern', favoriteIceCreams: ['Vanilla', 'French Vanilla', 'Vanilla Bean', 'Strawberry'] },
  { name: 'Robin', favoriteIceCreams: ['Strawberry', 'Chocolate', 'Mint Chocolate Chip'] }
];

const iceCreamTotals = data.reduce((acc, item) => {
  item.favoriteIceCreams.forEach((e) => {
    acc[e] = (acc[e] || 0) + 1;
  });
  return acc;
}, {});

console.log(iceCreamTotals);
/*{
  Strawberry: 3,
  Vanilla: 4,
  Chocolate: 5,
  'Cookies & Cream': 2,
  'Mint Chocolate Chip': 3,
  'Rocky Road': 1,
  Pistachio: 1,
  Banana: 1,
  'French Vanilla': 1,
  'Vanilla Bean': 1
}*/
```




```javascript
/*
 * Problem seven
 * Given an array, use reduce to calculate the average of sub arrays and print out the averages.
 */

const nums = [
  [1,6,9,2,5,4],
  [50,67,3,80,24,17],
  [100,77,50,35,12,56]
];

const averageSubArray = (inNums) => {
  const average = inNums.map((a) => {
    const averagesub = a.reduce((c, d) => c + d);
    return averagesub / a.length;
  }, [])
  return average;
}

console.log(averageSubArray(nums)); //[ 4.5, 40.166666666666664, 55 ]
```




```javascript
/*
 * Problem eight
 * Return the number of `true` in the array
 */

const trueArray = [true, false, false, true, true, false];

const countTrue = (inArray) => {
  const count = inArray.reduce((a, b) => a + (b === true ? 1 : 0), 0)
  return count;
};

console.log(countTrue(trueArray)); // 3
```


Оригинал: “https://dev.to/rakshithbellare/array-reduce-method-in-javascript-330d”