Уменьшение – это метод на прототипе объекта массива 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”