Array Manipulation Mastery: Map, Reduce, and Filter (with JavaScript examples)

preview_player
Показать описание
In this video, I'm going to talk about Array Manipulation: getting data from an array, and manipulating the structure of the data within an array to suit any and all of your needs.
In particular, I'm going to talk about the magic of Map, Reduce, and Filter. These functions together form an unstoppable team, and they'll upgrade your code's runtime, readability, and coolness-factor (that's totally a real thing).
I'm coding in JavaScript because that's what I'm comfortable with, but these concepts exist in most programming languages. A quick google search will show you the syntax for your language's equivalent. The concepts behind these functions, however, is universal so even if you don't use JS (and I don't blame you), hopefully you can learn a thing or two.

Like/subscribe/leave no trace if you enjoyed this video. Comment if you have questions, or let me know what other topics you'd like to see explained! Have a lovely day :)

TL;DW Notes:

Naive For Loop
* Not usually needed
* What does a for loop do?
* Make an index variable, loop through it, usually with i++
* Mostly replaceable by forEach, which we’ll get into next
* Main benefit: You can skip loop iterations with a custom iterator (for example, i += 3 or i -= 4) etc.

ForEach
* You can still have an index variable, otherwise it provides a faster and easier-to-read way to say “loop through every element of this array and do something with it”
* The most standard way to interact with each element of an Array, but not always the best.

Map
* Calls a function on each element of an array, then returns the result.
* Benefits:
* Returns the array for you, so if you need to manipulate an array by changing each element and pushing it to a new array, this is faster and cleaner.
* Can easily be chained with reduce and filter for advanced array manipulation
* Hype points: map is a cool function, and you’ll be cool for using it.
* Usecases:
* Your data comes to you as an object, but you only care about one of its key value pairs. You can quickly map each object to the value you care about.
* Your array needs to be transformed in some way (perhaps your array stores measurements and you need to change the unit). You can use a map to quickly do math operations on each element of the array and return the result.

Reduce
* Calls a function on each element of an array, but only returns one thing: the accumulator.
* Accumulator can be anything, but basically you want to use reduce if you have multiple values and you want to turn it into fewer (or one) value(s).
* Benefits:
* Returns the accumulator to you without instantiating a new variable
* Works really well in conjunction with map and filter
* Hype points
* Usecases:
* You have an array of data points, you want to find the average. You can use reduce with an accumulator that starts at 0 to sum up the array and return the average.
* You have an array with nested values (for example, you have an array of posts, each with its own array of comments). You can use reduce to flatten the array and return just a list of all comments.

Filter
* Calls a function on each element, keeps the element in the array if it matches the condition, discards it if not.
* Benefits:
* Returns the array for you
* Can be chained with map and reduce
* Not really hype... map and reduce have all the glory
* Usecases:
* Your array contains objects of people and their data. You only want to keep the guys. You can do this easily with filter.
* Your array contains objects of people and their data. You only want to keep people over a certain age. You can do this with filter as well.

The greatest strength of these functions is the ability to chain them together. Combine them and summon MapReduceFilter EXODIA.
Рекомендации по теме