JavaScript Array reduce method

How to use the JavaScript Array reduce method.
Similar to the map, filter, and forEach methods in how it is written, the main difference with this method is that it wants to return a single value that represents some aspect of the values in the original Array.
Code Gist: gist.github.com/prof3ssorSt3v...
MDN reference: developer.mozilla.org/en-US/d...

[@mohammedfakih4829]

You have one of the best Channels when it comes to Javascript - I'm new to programming. For the last 10 days , whenever I get stuck understanding any concept about JS , your Channel is the No.1 resource I use and will continue to do so in future. Big thanks for the quality content you are providing for us all , you are a great tutor .

[@shaderone07]

No words, just Respect . I feel like i don't have to go anywhere to understand javascript.

[@arielh7480]

This is so great. Your explanations simplify these methods so well. Thank you!

[@itouchgrass869]

I love your and Web Dev Simplified's tutorials. You both explain complicated concepts so well! Thank you so much!

[@rotrose7531]

Thank you very much, second round, your tutorials never fails to fascinate me.

[@MultiChinglish]

Thanks! Best explanation of reduce yet! Especially the point of 'only return one thing'!!

[@evgenboychuk8962]

You are a great person and teacher! Much appreciated for your efforts! Greetings from Kyiv!

[@immortalf1719]

Great clarification! Loved it, solved the issue for me.

[@andriusdadasev5510]

Another great video from Steve. Thanks for adding code gist, very convenient :)

[@fremontcheng2424]

Your explanation is so great. It saves my day. I love your video!!!!!

[@davidhernandez1699]

Hey, nice and simple explanation. Thanks!

[@joebuono8793]

Fantastic. I would love to take a full course from you.

[@kieranbarker1902]

I just liked this video before even watching it, because it's a Steve Griffith video. Of course it's going to be good.

[@NYC_CuriousG]

Nice!! Thank you. This makes more sense to me now

[@chesterxp508]

Brilliant tutorials !!!

[@AkashGupta-qc8rt]

you are great .. love From India

[@lovesteve1400]

Keep going pro i love your relaxing voice + your content ❤️ and one day i will be professional js programmer and i will not forget your channel

[@tyrodev5281]

Thank You, Steve!

[@princemehta572]

love you steve .. you makes the simplest videos ,, yalo yoloo

[@ethanhassell4181]

Thanks so much for these videos! Whenever there is a concept that I don't quite grasp, you are the first resource that I turn to for help. You should consider creating a course if you haven't already. I would be the first in line to buy a Udemy course from you!

[@SteveGriffith-Prof3ssorSt3v3]

I decided a long time ago to keep my content free on KZbin. People can make donations on here to help support my work with the super thanks feature. The heart icon with the dollar sign on it. :)

[@paarden654321]

You are helping me so much with my exams! I study IT in belgium, thank you :)

[@SteveGriffith-Prof3ssorSt3v3]

Miriam Plugge please share my channel so it helps others too

[@SteveGriffith-Prof3ssorSt3v3]

Good luck on your exams!

[@rotrose7531]

Legend, Thank you!

[@TOMGAMING-hy9hi]

it is just amazing sir it helped me a lot........thanks...........

[@logancarvalho]

Thanks again Steve for your classes, they are great. I´d like to point out that it´s possible to use reduce() function without a starting value. We could also do: let first = movies.reduce(function(current, item){ } },); 🙏

[@SteveGriffith-Prof3ssorSt3v3]

Yes. You just need to he careful about how you handle the accumulator value in the first pass

[@baldmannnnn]

Your channel is really underrated. Can you do a video about how reduce/reduceRight is used in composition?

[@SteveGriffith-Prof3ssorSt3v3]

You can put tutorial requests in the comments here - kzbin.info/www/bejne/gnTIq5SuZ9qBacU

[@IvanMithun]

Thank you ,..

[@linkone2489]

this is a great video! i have a question. how did the function know to compare ONLY the first character?

[@SteveGriffith-Prof3ssorSt3v3]

It is doing a comparison of the whole string. If the first character is different then it only needs to look at the first character. If the first character is the same then it looks at the value of the second characters.

[@andrewgarfinkel1978]

do you have to pass in the optional starting value for the films reduce method? I believe you will start at the first element if you do not pass in a starting point. What if no films came earlier alphabetically than your initial unicode character? Then you'd be returning that I believe

[@SteveGriffith-Prof3ssorSt3v3]

Yes. If you do NOT pass in the starting value then the first value from the array will be used as the starting value and your loop will start at the second element. However, I avoid this approach because it makes the code less readable and assumes that the person looking at the code will absolutely know what the first value in the array is.

[@johnywhy4679]

For clarity, `passedIn` could also be called `resultFromOperationOnPreviousElement`, correct?

[@johnaweiss]

Correct me if i'm wrong, your alpha comparison does return the 'first' item, as you intend, but it doesn't produce a fully-sorted array. You'd have to sort through the array several times, until there are no more changes (up to the total number of elements), before you can know that the whole array is sorted. For example, using your method, this: fecadbg after just one pass-through, will produce this: ecadbfg

[@SteveGriffith-Prof3ssorSt3v3]

The sort method loops as many times as it needs in order to sort the array.

[@johnaweiss]

@@SteveGriffith-Prof3ssorSt3v3 It does? But it seems to only loop thru the array once ,according to your explanation. Also, if it does loop thru repeatedly, then that's inefficient to get 'first'. You don't need to sort the whole array to get 'first'.

[@SteveGriffith-Prof3ssorSt3v3]

The sort( ) method doesn't actually loop like map and filter and forEach and reduce, etc. It grabs different pairs of items from the array and compares them. It keeps comparing pairs until there are no changes needed. kzbin.info/www/bejne/sIfIp59jgJKgbbs

[@CapitalDynastyLLC]

How come the Russian ascii code for the letter, D, is higher than the English letter, L?

[@SteveGriffith-Prof3ssorSt3v3]

The first 255 characters are the ASCII values (the English/latin-based characters and punctuation). These values were transferred into UTF-8 with the same values. All the characters, glyphs, and symbols for other languages, Math, Music, etc. are above the initial 255.

[@CapitalDynastyLLC]

Steve Griffith thanks for the succinct response. Now, it makes sense to me. It’s much appreciated, mate!

[@mitchell4217]

@@SteveGriffith-Prof3ssorSt3v3 Aren't you looking for the higher value? If the Russian D is a higher value than any regular alphabet, shouldn't it win out over all the movies? At what point does that function know to switch over to the English alphabet and take the higher alphabetical value?

[@SteveGriffith-Prof3ssorSt3v3]

@@mitchell4217 The value of current will be the Russian D, the first time the reduce loop runs. So, it gets replaced in the first pass because it will not be less than any character in the array.

[@mitchell4217]

@@SteveGriffith-Prof3ssorSt3v3 Alright, get what you are saying. I was thinking that an A would be higher on the list than Z when in reality, we're counting from z down to a. theasciicode.com.ar/ I've been trying to wrap my head around it all day. Thanks. Lightbulb moment.

[@rongrongie5668]

Hi Steve, Could you please explain to me how this remove duplicate code works? let arr = [1, 2, 1, 2, 3, 5, 4, 5, 3, 4, 4, 4, 4]; let result = arr.sort( ).reduce(( init, current ) => { if (init.length === 0 || init [ init.length - 1] !== current) { init.push (current); } return init; }, [ ] ); console.log(result); //[1,2,3,4,5] I'm stuck with it for days and it's driving me nuts..

[@SteveGriffith-Prof3ssorSt3v3]

The reduce method calls the function. The function has two parameters - init, current. init is the initial value, which is the empty array [ ], written after the function. arr.reduce( (init, current) => { }, [ ] ); current will represent each value from the array. Every time the function gets called, the parameter called current will hold each of those values. The function returns the variable init. This return value gets passed into the init variable each time the reduce function is called. What the function does is checks to see if the current value passed into the function is the same as the previous value in the array called init. If not then the new current value is added to the init array. The if statement inside the function is checking if the init array is empty, meaning that anything can be added to the array. OR it checks if the most recent item added to the array is the same as the current value passed into the function in the variable current. For this to work properly we need to sort the contents of the array first. that way all the 1s are together, the 2s are together, the 3s are together, and so on.

[@rongrongie5668]

Big thanks Steve, your explanation made it very clear. Damn it's really that simple and I couldn't wrap my head around it , reduce() It's the only thing so far for me that it's hard to grasp the concept. But now I understand it :D

[@johnaweiss]

Suggestion, turn off sound auto-level on your cam. It makes your voice constantly fade in and out while you're talking, which is distracting. Worse, it's not fast enough to bring up quiet words spoken right after loud words, so those quiet words tend to disappear and can't be heard properly. Setting your mic to a fixed level will sound more natural, and will ensure quiet words won't get lost. Auto-level is best for situations with unpredictable loud and quiet sounds that you have no control over. You have control over your sounds in this context. thx!

[@SteveGriffith-Prof3ssorSt3v3]

The videos that I did back in 2017 were on an old cheap mic. Anything in the last couple years is with a new much better quality mic.

[@yarik83men51]

+++