Тёмный

JavaScript Array Reduce 

Programming with Mosh
Подписаться 4,1 млн
Просмотров 338 тыс.
50% 1

JavaScript Array Reduce
🔥Get the COMPLETE course (83% OFF - LIMITED TIME ONLY): bit.ly/2KZea52
Subscribe for more videos:
/ @programmingwithmosh
Want to learn more from me? Check out my blog and courses:
programmingwith...
/ programmingwithmosh
/ moshhamedani

Опубликовано:

 

30 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 371   
@albatros280
@albatros280 6 лет назад
Finally... Somebody who explains reduce well. MDN documentation didn't help me.
@ginnerzapata5909
@ginnerzapata5909 5 лет назад
Just came from MDN 'cause I didnt understant a sheep!
@monfernape
@monfernape 5 лет назад
Exactly.
@kelechukwutasie4030
@kelechukwutasie4030 5 лет назад
You are very right! MDN didnt help at all...
@frownless
@frownless 4 года назад
Ikr he is awesome
@damascanalexandru4998
@damascanalexandru4998 4 года назад
So much clarity in 7 minutes video !
@haroldcjennettiii
@haroldcjennettiii 4 года назад
Once again Mosh shows why he's one of the best coding teachers. You make things very clear, because you explain what EVERYTHING is, in laymen's terms. A lot of coding teachers forget they're teaching beginners.
@rpb4865
@rpb4865 2 года назад
Can anyone explain why for loop or foreach is "old way" and reduce is more "elegant way"? I find the"old way" more readable than the "elegant way"
@hamdiboujarra
@hamdiboujarra 2 года назад
understand the elegant way and use the readable way if you want, after some months you will like to use the elegant way
@mikaelhelin6348
@mikaelhelin6348 2 года назад
I also think the "old way" is better. The "elegant way" is limited to iteration of type y_n = f(y_{n-1}, x_n) where f is the callback function. There is this new movement in programming where people think old fashion for-loops are ugly code.
@zdargahi
@zdargahi 5 лет назад
It would be great if you explain how the accumulation can be an array or object, and how when instead of chaining map and filter we can use reduce. I guess it's in the complete course.
@liamwelsh5565
@liamwelsh5565 2 года назад
If you were using an array, you could return an array in the reduce, and spread the accumulator. Then add any new value after. Example: nums = [1,2,3,4,5] const doubledNums = nums.reduce( (acc, num) => [...acc, num*2], [ ]) console.log(doubledNums) // [2,4,6,8,10] Obviosuly a .map could do the same thing but there are more complex examples where it is useful.
@Xetron1978
@Xetron1978 2 года назад
@@liamwelsh5565 Hi, I'm very new to coding, may I know why did you add the "..." before acc? I'm not really sure what it does here
@liamwelsh5565
@liamwelsh5565 2 года назад
@@Xetron1978 … is the spread operator. If you have an array, let’s call x and want to make a new array, let’s call y, that has all the values of x, you can spread x into y. Example: Const x = [1,2,3] Const y = […x] Console.log(y) // [1,2,3] You can also spread objects into objects
@RetroRick1990
@RetroRick1990 4 года назад
Awesome , just understand what is the role of the "Accumulator" and the "Current Value" makes everything very clear. Thank man!
@harwinderthakur9708
@harwinderthakur9708 4 года назад
I spent 20 minutes on mdn understanding all this. I got more confused there.Thanks man
@Phoenix24Leas
@Phoenix24Leas 4 года назад
This is nice but it'd be great if there was something on how to use reduce when making new objects/arrays
@MelanieTv
@MelanieTv 5 лет назад
No entiendo bien el ingles, y entendí el uso del Reduce super bien :0, u eso creo, jaja Muchas gracias!
@Asuuri
@Asuuri 3 года назад
jajaj mosh es muy bien!
@cbehen
@cbehen 2 года назад
actually, it must be accumulator += currentValue but just + works here maybe because of reduce method is holding the current value in memory for every iteration.
@golden-dragon1442
@golden-dragon1442 3 года назад
hi Mosh thank you for the video. one thing i didnt understand was the second argument (0), i understand that it represents the number 1 (being the first on teh array) but what if thaht number is 3 or 10 what will happen when the code logs?
@tung01vuongtri33
@tung01vuongtri33 2 года назад
finally, I can totally understand the reduce method thanks to you, appreciate your channel
@clarinetisfying
@clarinetisfying 2 года назад
I love he teaches coding very clearly in a short amount of time. He's the best coding teacher.
@msh1830
@msh1830 Год назад
ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-a_Bfu1XWGmI.html
@muthukumar8009
@muthukumar8009 4 года назад
great explanation Mosh.. [...Array(1000)].reduce((acc, elem) => { return acc + 'Thanks Mosh '; }, ['Great Explanation ']);
@ramirosandoval781
@ramirosandoval781 4 года назад
But why the second argument in numbers.reduce() (zero) goes to "accumulator"?
@programacaoja9679
@programacaoja9679 4 года назад
it is the implementation of the function reduce(). A implementation could be like that: const reduce = function(iterable, reduceFn, accumulator){ for(let i of iterable){ accumulator = reduceFn(accumulator, i) } return accumulator }
@BobbyBundlez
@BobbyBundlez 4 года назад
? each time we add to the accumulator. the current value starts at 0 mosh didn't explain this part but you can change the starting value with a last argument after teh callback.. in the exmple below the starting value and starting accumulator value would be 50. const final=numbers.reduce((accumulator, current val)=>{ return accumulator+current val }, 50); we start by adding the first number in the array to 50(or the first current value we are working with) then if that result was 52... then the accumulator is 52, then the current value moves on to the next index number in the array and keeps going until it adds each value in the array together onto the accumulator basically the current value is the current value in the array we are currently working with. each array method does whatver the callback says to do on EACH value in the array. the current value in moshes example becomes 0 at one point because we add -1 to 1... which is 0 hope this helped?
@ycombinator765
@ycombinator765 3 года назад
Amazingly clear!! Functional Programming is the best ❤️
@msh1830
@msh1830 Год назад
ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-a_Bfu1XWGmI.html
@Nessquickable
@Nessquickable 5 лет назад
Hadn't got used to that reduce method and was struggling for a while, only took me a minute of your explanation to spark a lightbulb in my head and I felt relieved. Thank you.
@msh1830
@msh1830 Год назад
ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-a_Bfu1XWGmI.html
@opasceptre
@opasceptre 3 года назад
Boss more blessing to you, love from Nigeria. You just explained all MDN couldn't in minutes
@bangunny
@bangunny 3 года назад
hay quá, cảm ơn bạn
@JeffThePoustman
@JeffThePoustman 5 лет назад
Thank you, Mosh. I found this very helpful for grasping the concept of reduce().
@Chief_Sir_E.C.O._Nwuju
@Chief_Sir_E.C.O._Nwuju Год назад
Thank you so much brother,your explanation was very simple and clear
@johnisutsa1641
@johnisutsa1641 5 лет назад
How am I only finding your tutorials now. You explain so well. I'm taking you with me for the rest of my Java script journey.
@rajabmuhamedrajab5128
@rajabmuhamedrajab5128 4 года назад
You Are Great..........................
@nosense7859
@nosense7859 3 года назад
vip pro ú ú ú chả hiểu tiếng nhưng mà để x2 xem ví dụ bao phê ...
@blast2427
@blast2427 2 года назад
Hi Mosh, great video! Could you make a similar one explaining array sort?
@limodemh5468
@limodemh5468 3 года назад
Hi , Anyone knowwhy when i use: const numbers = [1, -1, 2, 3]; let sum = 0; for (let n in numbers) sum += n; console.log("sum: " + sum); getting - sum: 00123
@slickchick8292
@slickchick8292 2 года назад
Mosh, thank you so much! You broke this down into a very easy to understand way.
@jame_sta
@jame_sta 6 лет назад
You're the BEST Instructor I've ever come across +ProgrammingwithMosh *sheds a tear* LOL :D -- I can't wait for more JS videos!!!!!
@hebahamdi3855
@hebahamdi3855 4 года назад
Thank you for making js clear and simple to understand
@BobbyBundlez
@BobbyBundlez 4 года назад
mosh didn't explain this part but you can change the starting value with a last argument after the callback.. he kind of explained it but didn't fully lol... in the example below the starting value and thus the starting accumulator value would be 50. const final=numbers.reduce((accumulator, current val)=>{ return accumulator+current val }, 50);
@miiMarit207
@miiMarit207 4 дня назад
Now I finally understand what is really happening with the reduce method.
@chriss6443
@chriss6443 3 года назад
Looking at the comments below people have spent ages trying to understand the reduce function. Why? Cos just like everything in Javascript its BS! :6:43 Mosh talks about the old way - using For loops. Well at least for loops are self evidently obvious! If i'm debugging code I don't want to spend an eternity trying to understand symbols that have no apparent meaning or reference!
@onyeukwuhycient438
@onyeukwuhycient438 2 года назад
This is by far the clearest explanation I've seen on the reduce method so far.. Thanks a lot Mr Mosh..
@rajabmuhamedrajab5128
@rajabmuhamedrajab5128 4 года назад
Finally ... some who explain reduce well .Thanks
@sarapoli5786
@sarapoli5786 Год назад
Omg I wouldn't learn it without this video. Still I think for loop is easier ;) I think reduce is fancy way of coding :D I don't like it but that's the way you see people code in real job :D
@marygracegardner2843
@marygracegardner2843 2 года назад
Thank you dude, this is incredible. I wasn't understanding this before watching your video, thank you.
@Pareshbpatel
@Pareshbpatel 3 года назад
Nice explanation of the Reduce Method of arrays. Thanks, Mosh {2021-08-14}
@MatchesMaloneThe3rd
@MatchesMaloneThe3rd 4 года назад
Cleanest explanation I've seen so far. You just earned yourself a sub.
@YouWhoKC
@YouWhoKC 2 года назад
For me, his approach doesnt help me learn anything. Information overload. Context in the real world, etc. How would I want to use this method, and why. Spit it out already.
@tdepunkemo
@tdepunkemo 3 года назад
Does anyone know if we can change the function to where it SUBTRACTS and accumulator and aggregator? Also, why the need to write out an entire function if a method is supposed to be a shortcut for this?
@millertime6
@millertime6 5 лет назад
Took me a while to get reduce even after learning all the other iteration methods. Thank you!
@emilewamsteker3412
@emilewamsteker3412 4 года назад
The way this is presented seems to suggest that the reduce method is only used to sum all the values in an array. You have an accumulator and a current value. However, it's my understanding you can do other calculations with reduce to get at a single value. How would you find the maximum number in an array of numbers, for example, using reduce? What is the function of the accumulator and current value in that case? I find this demo very clear in how it works with summing all the values in an array, but it really doesn't show how reduce works in the real world, and I'm afraid it's a little misleading.
@nadeerahashankuruppu5962
@nadeerahashankuruppu5962 4 года назад
Thank u for the great explanation let num = numbers.reduce((a,c) => a+=c ,2)
@vedatsozen
@vedatsozen 2 года назад
Thank really. I was making a project. I am adding tips of bills as % to a calculation machine and i need to sum all tips and print. At the end i succeeded by looking to your tutorial. Thanks so much.
@NITESHSINGHNRS
@NITESHSINGHNRS 5 лет назад
Best... Thank you sir...love from india.♥️
@Scrimm_
@Scrimm_ 2 года назад
What if you had multiple objects with multiple properties nested inside an array and you wanted to use .reduce on the same property for each object? Just need to nest everything properly?
@muhammadsultanularafin8846
@muhammadsultanularafin8846 4 года назад
Wow! Explained in a super easy way. Thank you.
@sinamohammadi970
@sinamohammadi970 2 года назад
Lovely explaination and lovely Mosh. We Love You Mosh, From Iran.
@adexmokson7185
@adexmokson7185 Год назад
This is just the simplest of reduce function it is far more complicated than this. It is the most complicated array method and using it for sum is not really the objective.
@ryansatriayudha
@ryansatriayudha 10 месяцев назад
This is very clear and simple explanation!! Thank you very much 😊
@pranjalruhela1103
@pranjalruhela1103 16 дней назад
Accumulator, current value (through iterations) and initial value
@hqav1783
@hqav1783 5 лет назад
How did the function taked "numbers" const?
@paavangupta3420
@paavangupta3420 2 года назад
Your explanation was amazing! By the way, which VS Code theme is that?
@nidhikumari4983
@nidhikumari4983 2 года назад
thank you for explaning the basic concepts very clear...best explanation
@praiseb2god724
@praiseb2god724 2 года назад
Excellent and simplified. Is this method not called object deconstruction?
@hungryutkarsh
@hungryutkarsh 4 года назад
this was fucking awesome! I felt guilty for not subscribing :D
@yzchenwei
@yzchenwei 4 года назад
actually, I like old way much better. javascript simply sucks.
@bradenspendlove3869
@bradenspendlove3869 2 года назад
ok so i must know how the second version of code is "easier" i counter 44 key strokes of code on the first method and over 50 on line 10 alone. am i missing something?
@PatrikRasch
@PatrikRasch 2 года назад
Thank you for the good explanation and help.
@alvarosena858
@alvarosena858 3 года назад
This video is posted a long time ago, but for the first time i understand reduce. Thanks Mosh!
@evgeniik_
@evgeniik_ 2 года назад
In the second example you say the Current Value is set to -1, how come? Can anyone explain please.
@nemesisteam914
@nemesisteam914 4 года назад
Please having one problem in the for loop why he doesn't include curly braces bro please does mosh installed any extension to do so?? Please someone reply
@mavs4life248
@mavs4life248 6 месяцев назад
Thank you for breaking this down in detail. Very easy to understand.
@bhavanachavan164
@bhavanachavan164 4 года назад
interesting ... i like the way u teaching explaining...thank u so much....and keep it up....
@jasonkowens6820
@jasonkowens6820 6 лет назад
Excellent breakdown as usual, cool new js feature
@kamleshbisht9811
@kamleshbisht9811 2 года назад
nice explanation please do explain how the fuction and codes work it will be very helpful thanks
@md.bulbulislam2326
@md.bulbulislam2326 3 года назад
Thank you so much for the beautiful explanation of reduce the method.
@michaelrooze278
@michaelrooze278 4 года назад
still not sure why its called "reduce"....what are we reducing? It seems like we are adding
@drunkbutsober18
@drunkbutsober18 2 года назад
Awesome explanation! Thank you for this!
@timilehinoni
@timilehinoni 3 года назад
By far the best explanation of reduce I have gotten haven watch tones of videos and tutorials
@mariodmp
@mariodmp 6 лет назад
This is super detailed, yet simple to understand, just great!
@ginger-bread_man
@ginger-bread_man 4 года назад
What is at the advantage of "reduce"? Is it just syntactic sugar or is there a performance gain?
@babo4019
@babo4019 4 года назад
Is there other benefits of using .reduce() method other than the readability and cleaner code?
@OMARCODER-zz4si
@OMARCODER-zz4si 4 года назад
as usual, you make coding easy ...your explanation is great
@msh1830
@msh1830 Год назад
ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-a_Bfu1XWGmI.html
@perfectionchizuruoke6207
@perfectionchizuruoke6207 2 года назад
Thank you mosh you explained it perfectly
@mertmertoglu7531
@mertmertoglu7531 6 лет назад
if "old way" is faster, i prefer the faster one.
@rogerh2694
@rogerh2694 6 лет назад
as in time complexity
@sagarock1012
@sagarock1012 5 лет назад
@@rogerh2694 yes
@CameronChardukian
@CameronChardukian 5 лет назад
If you're struggling with .reduce, watch this video and do the exercises at codecademy. Then you should be good!
@sanyogyadav3913
@sanyogyadav3913 2 года назад
thanks buddy for making concept clear
@olumorsotnas
@olumorsotnas Год назад
Best code videos I ever watched. Thank you brother!
@nemesisprogramming4409
@nemesisprogramming4409 4 года назад
why in the for loop he doesnt put curly braces please someone help if some extension he add for it please
@j.k.ravshanovich
@j.k.ravshanovich 4 года назад
Explained better than MDN. Good job!
@wisdom5603
@wisdom5603 Год назад
why current value won't be 1 when a=1. why it is -1?
@RedBricksTraffic
@RedBricksTraffic 2 года назад
Having it explained in video form is so much easier for me than reading it. Thank you!
@msh1830
@msh1830 Год назад
ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-a_Bfu1XWGmI.html
@christopherblair1456
@christopherblair1456 3 года назад
I wish there were some more advanced examples of how/why this is used.
@code_fu552
@code_fu552 5 лет назад
Amazing!!! Thank u for breaking it down and explaining the components . Very helpful.
@msh1830
@msh1830 Год назад
ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-a_Bfu1XWGmI.html
@saleema6308
@saleema6308 2 года назад
Would you like to add video on useReducer and Context Api??
@aiknowledge-n2s
@aiknowledge-n2s 2 года назад
The first tutorial that made me understand reduce method. Thanks.
@glantzdesign6239
@glantzdesign6239 5 лет назад
Thank you Mosh. I wish everyone can explain things as clearly as you.
@katebekatuka3447
@katebekatuka3447 4 года назад
This explanation is way better than the documentation.
@EnricMartin1987
@EnricMartin1987 Год назад
Thank you Mosh. This is one of the best explanations about how to use reduce, that I could find on RU-vid.
@shlomi5044
@shlomi5044 2 года назад
I've been looking for this theme for a year and can't find it
@Sameer58580
@Sameer58580 2 года назад
Thank you was having trouble understanding it
3 года назад
Thanks a lot! Very good explaination ;)
@mariomeza3514
@mariomeza3514 Год назад
I feel like the for loop looks alot cleaner than the reduce() method.
@MillennialMayhem
@MillennialMayhem 3 года назад
How does this work for an array of objects though?
@brain8893
@brain8893 2 года назад
Wow this guy is simply the best and you cannot dispute that
@user-zp5iy3zu3h
@user-zp5iy3zu3h 2 года назад
Wow, thank you, this is a great explanation!
@readingplaylists495
@readingplaylists495 3 года назад
You explain very well. Thanks!
@floridaman7
@floridaman7 2 года назад
This is a better description than coding academy.
@alejandrocuevas8999
@alejandrocuevas8999 3 года назад
You’re the big boss. 😎😎😎 I went through other websites and videos but your explanation was the best. Thank you very much! I had the answer all time at home, since I was subscribed to your channel before. 🤩🤩🤩
@encapsule2220
@encapsule2220 2 года назад
this thing was making me pull my hair out, thanks mosh
Далее
ES6 Tutorial: Learn Modern JavaScript in 1 Hour
50:05
Просмотров 994 тыс.
5 Real Life Examples of Array Reduce in JavaScript
12:47
Learn JavaScript Array Reduce In 10 Minutes
10:22
Просмотров 202 тыс.
JavaScript DESTRUCTURING in 8 minutes! 💥
8:41
Просмотров 21 тыс.
5 JavaScript Concepts You HAVE TO KNOW
9:38
Просмотров 1,4 млн
JavaScript Bitwise Operators
9:26
Просмотров 101 тыс.
Array Methods in JavaScript | 17 Useful Methods
42:39
Solving a JavaScript Array Reduce Interview Question
11:27
Reduce это просто. JavaScript
17:11
Просмотров 61 тыс.