Last active
November 21, 2019 17:34
-
-
Save leo-bianchi/78b6641efe655aa8eb942e402ab3e02f to your computer and use it in GitHub Desktop.
Javascript ES6 (ES0215) .map(), .reduce(), .filter() usage examples.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// FILTER | |
/* | |
If i already have an array but i only want to have items in the array that match certain criteria, use the filter. | |
Quando eu já tenho um array e quero apenas itens no novo array que correspondem a uma condição, use filter. | |
*/ | |
// GET JUST EVEN NUMBERS | |
let arr = [-200, -163, -26, -4, 0, 7, 76]; | |
let evens = arr.filter(function(x) { | |
return x % 2 === 0; | |
}); | |
// Arrow function | |
let evens = arr.filter(x => x % 2 === 0); | |
// Using external function | |
function isEven(value) { | |
return value % 2 === 0; | |
} | |
let evens = arr.filter(isEven); | |
// MAP | |
/* | |
If i already have an array and i want to do the exact same operation on each of the elements in the array and return the same amount of items in the array, use the map. | |
Se eu já tenho um array e quero fazer uma mesma operação em cada elemento do array e retorna a mesma quantidade de itens do array, use map. | |
*/ | |
// MULTIPLY ALL ARRAY VALUES | |
let arr1 = [1, 2, 3, 4]; | |
let mult = arr1.map(function (value){ | |
return value * 3; | |
}); | |
// Arrow function | |
let mult = arr1.map(value => value * 3); | |
// REDUCE | |
/* | |
If i already have an array, but i want to use the values in that array to create something completely new, use the reduce. | |
Se eu já tenho um array, mas eu quero usar os valores deste array para criar algo completamente novo, use reduce. | |
*/ | |
// SUM UP THE POPULATION OF EVERY COUNTRY EXCEPT CHINA? | |
let data = [ | |
{ | |
country: 'China', | |
pop: 1409517397, | |
}, | |
{ | |
country: 'India', | |
pop: 1339180127, | |
}, | |
{ | |
country: 'USA', | |
pop: 324459463, | |
}, | |
{ | |
country: 'Indonesia', | |
pop: 263991379, | |
} | |
]; | |
let sum = data.reduce((acc, val) => { | |
return val.country == 'China' ? acc : acc + val.pop; | |
}, 0); | |
// SUM TOTAL PILOTS YEARS | |
let pilots = [ | |
{ | |
id: 10, | |
name: "Poe Dameron", | |
years: 14, | |
}, | |
{ | |
id: 2, | |
name: "Temmin 'Snap' Wexley", | |
years: 30, | |
}, | |
{ | |
id: 41, | |
name: "Tallissan Lintra", | |
years: 16, | |
}, | |
{ | |
id: 99, | |
name: "Ello Asty", | |
years: 22, | |
} | |
]; | |
let alYears = pilots.reduce((acc, pilot) => acc + pilot.years, 0); | |
/* | |
REFERENCES | |
DESCRIPTIONS: https://hackernoon.com/understanding-map-filter-and-reduce-in-javascript-5df1c7eee464 | |
FILTER EVEN NUMBERS EXAMPLE: https://stackoverflow.com/a/51876403 | |
REDUCE POPULATION EXAMPLE: https://codeburst.io/learn-understand-javascripts-reduce-function-b2b0406efbdc | |
REDUCE PILOTS YEARS EXAMPLE: https://medium.com/poka-techblog/simplify-your-javascript-use-map-reduce-and-filter-bd02c593cc2d | |
*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment