Recursion - Part 7 of Functional Programming in JavaScript
HTML-код
- Опубликовано: 22 май 2024
- 💖 Support the show by becoming a Patreon
/ funfunfunction
In this video, we are going to learn about recursion - what recursion is, how it works, and why it's useful.
This video is part of a series - you'll get a lot more out of it if you watch the other episodes before watching this one. You can find them here:
• Functional programming...
Recursion is when a function calls itself until it doesn't.
That is seriously all recursion is. It's really simple.
A lot of people think that recursion is hard. The reason people think that recursion is hard is because all explanations of recursion use fibonacci numbers as an example, which is the worst example ever. If somebody tries to explain recursion to you using fibonnaci numbers, you must murder them. I understand that sounds rough, because they mean well, but we really need to get rid of that, because it makes everyone think that recursion is hard, when it is actually easy.
💛 Follow on Twitch
We record the show live Mondays 7 AM PT
/ funfunfunction
💛 Fun Fun Forum
Private discussion forum with other viewers in between shows. www.funfunforum.com. Available to patron members, become one at / funfunfunction
💛 mpj on Twitter
/ mpjme
💛 CircleCI (Show sponsor)
Robust and sleek Docker-based Continuous Integration as a service. I used CircleCI prior to them becoming a sponsor and I love that their free tier is powerful enough for small personal projects, even if they are private. Use this link when you sign up to let them know you came from here:
circleci.funfunfunction.com
💛 Quokka (Show sponsor)
Wonder how MPJ evaluates JavaScript inline his editor. Quokka is the answer - use this link when you buy to let them know you came from here:
quokka.funfunfunction.com
💛 FUN FUN FUNCTION
Since 2015, Fun Fun Function (FFF) is one of the longest running weekly RUclips shows on programming 🏅 thanks to its consistency and quality reaching 200,000+ developers.
🤦♂️ The Failing Together concept is what makes FFF unique. Most coding content out there focus on step-by-step tutorials. We think tutorials are too far removed from what everyday development is like. Instead, FFF has created a completely new learning environment where we grow from failure, by solving problems while intensively interacting with a live audience.
Tutorials try to solve a problem. Failing Together makes you grow as a developer and coworker.
📹 Each show is recorded live on Twitch in a 2-hour livestream on Mondays. The host, assisted by the audience, is tasked to complete a programming challenge by an expert guest. Like in the real world, we often fail, and learn from it. This, of course, reflects what the audience identifies with, and is one of the most praised aspects of the show.
⏯ On Fridays, an edited version of the show is adapted for and published on RUclips.
Content Topics revolve around: JavaScript, Functional Programming, Software Architecture, Quality Processes, Developer Career and Health, Software Development, Project Management 
Наука
I think everyone should watch this video again.
And again.
And again.
+Noah Namey Until they understand, then back out...
+Noah Namey I think you should read this comment again
Untill they don't
Still watching it
And again.
And again.
And again.
And again.
And again.
And again.
And again.
And again.
And again.
And again.
let categories = [
{ id: 'animals', parent: null },
{ id: 'mammals', parent: 'animals' },
{ id: 'cats', parent: 'mammals' },
{ id: 'dogs', parent: 'mammals' },
{ id: 'chihuahua', parent: 'dogs' },
{ id: 'labrador', parent: 'dogs' },
{ id: 'persian', parent: 'cats' },
{ id: 'siamese', parent: 'cats' }
];
// for the active learners
Thanks...
I saw it too late....
thnx bro
Thank you !
Good human!
"When somebody tries to explain recursion to you using fibonacci numbers... YOU. MUST. MURDER them." LOL
i wanted to like this comment. But there are 69 likes now. I don't wanna lose that number ;)
Walker Leite followed by "even if they are your friend, they must die!" 😂😂
this video completely ruined my life and my friend lost their life. now im serving a lifetime sentence, everyday running the same way in this jail cell, until the end of my life existence function. Thanks Guy!
I almost fell off my chair laughing in the library when he said that
Finally! someone to the rescue. 😂
@primosoma Absolutely, you're right on all accounts. One teacher once told me a great tidbit on pedagogy - it's about telling a big lie and then gradually reducing it by adding details during the semester. :) I know that the Fibonacci example is used because of it's completeness, but when it comes to explaining and communicating complicated concepts, perfect correctness often makes the example so unwieldy that it comes the expense of clarity. Humans are really good at gradually incorporating new details into their thought models, but need to expend a lot of energy on big things like functions calling functions, so it's better to try to skip as many details as possible initially imho.
the links to your previous videos don't show up on the screen?!
It's because you have disabled them in your settings.
lies
I should have murdered that guy in the "JS: Good parts" book lol. Used Fib numbers in to explain it and set my learning of recursion back years ... great vid man, love your personality :)
The intro was so funny! This video helped me a lot as I have just started learning JavaScript and am 10. :)
Things I love in your videos so far....
1) Seeing you code 'live', and explain what you are doing... because putting pre-written code on the screen makes it that much more difficult to grasp.
2) Answering the most important question.... the "Why" you want to learn the stuff being shown.
3) The summary at the end (reinforces the learning).
4) How you often describe stuff not in the main topic of the video, but very useful nonetheless (like 'let')
Things I would like to see in future videos...
1) All the above, of course
2) Suggestions for deepening the knowledge on the material, using outside resources. Perhaps extra stuff to watch, read, or try ourselves.
Thank you
+Evan Noway (amivag) Thanks a ton, Evan! Really love it when people articulate specifically what they like, helps me to understand what to keep doing and strengthen.
Golden QUOTE: "When somebody tries to explain recursion to you using Fibonacci numbers ... You MUST murder them!" ~ love this!!! the amount of times I have been given interview test using Fibonacci numbers in scala examples I wish I had a t-shirt on with your picture & this quote ... thank You - AWESOME!
I absolutely love your videos. Your way of teaching is great and kept me interested when I was still very clueless about what took place on the screen. I first came to you videos a few months ago when I didn't get much of anything but wanting to get an idea of what i could do with this language. It's a great feeling coming back to them now a second time (and there will be a third, fourth...) and now being able to understand more and to slowly implement some of this in my own code.
I'm a Finn so making me love a Swede instantly is quite a an achievement by you :D
I started learning JS about 3 months ago. I came across your videos today, and I am binge watching. I would not have grasped a fraction of this a month ago, and I just realized I am starting to understand base syntax to basically read what you are doing. I appreciate the "Aha!"moment. You are a great teacher, everything you do appears to have the student in mind with the right amount of push forward.
This is an amazing practical application of recursion!! Thank you for everything you do to make the world a better place!!!
Truly one of the most fascinating topics in computer science. Thanks MPJ, and godspeed on your new journey
Love your series of functional programming. It solve many, many of my programming problems. Great THANKS!
I just started your videos and you're a genius. Ive started as a .net and no front end and slowly converted to more front end and I'm always learning!
This is the first episode I've watched of yours. Good stuff! I found you to be both entertaining and informative. Functional programming has always been something I've longed to understand better. I'll be tuning in :)
Another great explanation of JS basics.
I'd like to see how you explain .call(), .apply() and .bind().
That goes against his ethos as a functional programmer lol
8:40 - That's a great advice in programming. I realized that, when I think BEFORE coding, I can resolve the problems in a faster and better way.
Thank you.
So great to see someone explaining this so lovely and simple. Too many times explanations are "over engineered". Been a JavaScript developer for 5 years...still learn new things from you!
I have watched 3 different videos before this one trying to learn and understand Recursion....THANK GOD FOR THIS VIDEO!!! I wish the other were this clear. Due to this video, I definitely will be subscribing and sharing on Twitter. And this video is 3 years old (smile)
'cause trollin'
function fibonacci(a, b) {
const c = a + b
if(c < Number.MAX_SAFE_INTEGER) {
console.log(a + b)
fibonacci(b, c)
}
}
fibonacci(0, 1)
So true about the Fibonacci sequence! Great video! Helped me to better understand the concept.
That's the best teaching I've ever seen about recursion. Thank you !!!!
Super Video! Loved it. Was confused about how to get this tree format with recursion, watching this video made everything clear. Plus laughed through out!
Thank you for this! This might be the most relaxing coding chanel I've encountered! The music, ur personality, the explainations definating making some tea and binging some js basics :)
Stephen Florian Thank you for your interest in my ficus! The tree is a Ficus Microcarpa Ginseng. It is placed in front of a window facing south (my apartment is located in the southern part of Sweden).
I tend to water it once a week (recording the episodes provides a handy cue for this) by submerging the pot completely in water and letting it drain for a while (approximately 30 minutes) afterwards.
The tree has been doing very well for quite some time (I don't quite remember when I bought it, but it's around a year ago) Unlike my previous bonsai trees, this seems to be very resilient - most likely a very conscious decision by IKEA, where I bought it.
Where I would need advice is re-planting and nutrition, I have no clue about that. My girlfriend is a florist and could probably help me, but I would very much prefer to rely on my RUclips community for this because it would be awesome.
Now I really wanna go visit Sweden
I was just reading a post that mentioned a story: their professor in school said that students that didn't get recursion will likely never get it. Sounds like a closet fibonacci kinda professor lol. GET EM !!! funfunfuncion is the BEST youtube coding series
props to you mpj for using a very basic example and then actually using a real life example that recursion solves! you the man! great video as always!
Glad you liked it!
Love your way of talking; very simple and entertaining - it's not something that you hear very often in these kinds of videos
I didn't manage to keep track on your animals example, but I got the concept of recursion
Watched some of your videos last year for UNI as well, very helpful
This is the first video on recursion that didn't make me feel like an idiot for not understanding it. Thank you!
Here I am in the future, 2023 rewatching the AMAZING videos of Mathias teaching us JS, wonderful!
These videos are so great. I would love to see you take recursion further and look at permutation of string. It's a topic that I've looked at recently and I'm still clueless!
I just had the hugest breakthrough with recursion after watching your vid,
Thanks Man!
Loving your functional programming series! Awesome work.
This is the best explanation of recursion I've seen for beginners. Your videos are awesome! Thanks!
Dude you're awesome and your style of coding is so neat. I really learnt a lot from you. Don't worry I'm gonna finish the series
I understood straight away! Can't believe it.... I've been watching video after video and the example problems were way too complex - it seemed they were becoming more and more complex lol. Thanks for the simple break down.
I stumbled on your channel while looking for info on currying. I'm 7 episodes into this series and cant get enough. I was originally hooked by the catchy editing and humour (dude, you are seriously funny). More importantly though you have already unlocked some new areas of my understanding, especially relating to higher order functions and recursion, and its all down to your delivery, examples, and the style in which you explain.
I am usually a hit and run Googler. Thank-you's and chitter chat are not high on my priority list. Just gotta get the job done.
But seriously... Thank You. I feel like I have just levelled up one of those hidden abilities that your not sure you even have, and I'm excited about where that is going to lead me.
Cheers
+Drunken Acoustic Sessions... Thanks a ton for your thoughtful and kind words. I really appriceate it.
i remember watching this functional programming series awhile back and seeing this example... cool implementation, but after coming across hierarchical data in a real life example (rows returned from a SQL query) and trying to turn it into an Object tree MAN is this useful! Thank you so much!
Love your videos! I've learned a lot from it, and it made me smile a great deal. Great combination, thanks a lot!!!!
The beauty in your second recursion example is stunning!
I've struggled with this concept for years. Thank you MJ.
Nice, great video as usual. I find your explaination very clear. I've lately had to play with permutation (letters within a string) for an exersise and had to use the algorithm of heap (uses recursion). I took an example and did it, but honestly I had some difficulties to get everything, I found that one quite tricky...and I still have difficulties to grasp it. but your example gives more sense.I hope to be able to apply it on my own within my future project.
New viewers - MPJ installs babel with "npm install -g babel". This is now obsolete. You want "npm install -g babel-cli"
Great one! Learning useful stuff while enjoying your mystic! Thanks mate.
Amazing! Thank you for this beginner-friendly explanation
After reading some teorical things about control structures, it was good to hear your explanation. Thanks
The final example is quite beautiful. Thanks for the clear explanation 👍🏻
This was a great tutorial! I was so lost trying to figure out how to use this on a project, your category example was exactly what I needed. I come from a database driven background and I'm seriously struggling with the unstructured nature of javascript and understanding why you do things a certain way so all the "math" examples given from teachers and all other tutorials are not helpful to me at all, I do better dissecting working code to understand it properly and see how the functions are built out in conjunction with one another, that is another place I'm trying to master, I will browser the rest of your videos now, but this was super helpful!
Great video mate! This really helped me solve a coding challenge I was working on
Great channel, great series. Just great. Thanks for making these videos.
well... I'm really happy with this channel. ty MPJ. I undertand this code and this is a huge step for me.
I'm so glad we share the same 'standard string to output'. It's always console.log('poop') or console.long('ting')
Thats really great tutorial. Now i am fully able to understand real use of recursion....Thank you
You are awesome. It was really hard to find a tutorial that explained this clearly
Thank you for such a simple explanation. My story: a couple days ago I decided to pick up "Eloquent JavaScript". I blazed through the first couple chapters, and then was immediately road-blocked by a small section on Recursion in Chapter 3 (quite a convoluted way to introduce a concept, if you ask me-sorry Marijn Haverbeke). However! After watching your video here, I immediately solved the end-of-chapter exercise on recursion and was able to move on :) Thanks again.
Really great videos! It would be great to hear more about real life examples of recursion. And, yes, apply(), call(), and bind() are highly wanted. Great attitude and grear approach!
I am a huge fan of your channel. Its always so helpful especially the little tid bits of advice throughout that just have more to do with being and thinking like an engineer then sometimes even the topic at hand. Thank you for sharing. What about doing a video on recursion in es6 generators?
ES6 generators with recursion is a good idea, added!
i liked all ur vedios on functional programming.. The example that you take are simple(easy to understand) and in a way practical too. Thank u so much.. Keep posting.
thnx man, you illustration for concepts is awesome
Thank you for this simple yet clear tutorial! :)
Great videos Mattias, and a very interesting topic. You should definitely carry on doing these! I also follow you on Quora and many thanks for all the contribution there, it's awesome.
One thing that drew my attention was that you mentioned tail call optimization was so-called cause of the tail formed by stack frames. I'm not sure if you were entirely serious there, but just in case I wanted to put my two cents in if anyone is concerned.
Tail calls are actually quite specific function behavior, where the very last thing the function does is calling itself, with no additional calculations or logic. Then, it can be easily optimized - the stack frame normally has to remember where to return in case there is anything to do in the function later (when it gets out of the inner function call), but why should it return to the function that will only terminate - remember, it called itself as the last thing it ever did. So it's called "tail" call, cause it's the last thing function has (just like tail is the last thing a dog has, I suppose). At least that's my understanding, I hope it's clear and correct enough. Sorry if anyone else already pointed that out.
Here's a pretty great article on the topic if you're interested: www.2ality.com/2015/06/tail-call-optimization.html
Here's a pretty boring page on how proper tail calls are determined in ES6:
wiki.ecmascript.org/doku.php?id=proposals:proper_tail_calls
And here's a picture of a random cat:
ralphseastresgallery.files.wordpress.com/2014/05/random1.jpg
And also, if you guys are interested in functional programming, I recommend trying out Haskell if you haven't - it basically makes you write purely functional code if you like it or not, so it has only functions with tail calls, everything is curried (seriously, every multi-argument function in Haskell will return partially-applied function with just the first argument applied, then apply the next argument and curry and so on), and uses monads to control side effects (which are simply monoids in the category of endofunctors). Seriously, I strongly recommend, you'll hate it.
Anyway, again, awesome stuff, keep up the great work!
This was a very good introduction to recursion, thank you! I was a bit confused by the second example, but after pausing the video, it all clicked, smooth! Would you mind exploring recursion a bit more? I guess I'm still daunted by it because of the break case and recursion case, especially the latter. Thanks again!
clear and simple. well explained man.
You're the best man!!! Would be great if you made a recursion video on how to flatten an array without using a helper function (i.e. using forEach on the main array after declaring an empty array to send each element as to keep form resetting the declared new array and then using newArr = newArr.concat(recurse(onTheInnerArr) if the element is an array or else push the element to the newArr). Took a long time to find an answer like this and I'm sure it could help others if you had a video on it! Found the answer from Theodore Anderson but your style of teaching/enthusiasm really shines light where its needed in the dull corners of trying to understand concepts from time to time. Thanks!
Awesome! Very entertaining and informative!
Great explanation, thanks 🙏
Best darn explanation of recursion EVER. Used it to help my 12-year old daughter understand the concept. Bingo ... she could replicate a simplified version of your makeTree example once she saw the countDown portion of your video. You are a gifted instructor! Thank you (now we just have to get Dad using ECMAScript 6 ...
+Doug Wells wow, that is so awesome! It's so good that you are teaching your daughter how to code. Tell her hi from me!
Your such an amazing teacher, you're 100% correct about everyone using fibonachi to explain recursion, thanks and keep up the amazing videos!!
+minispecs123 also the newest version of node v4 supports all the shiny ECMA6 functions and features
+minispecs123 Thank you! And yes, hooray for node 4!
Those are great examples. Very helpful!
You do a good job of explaining up until the very end where you leave out critical details.
I can say the same of your comment.
@@funfunfunction It's hard to know how to describe what you don't understand in the first place. 95% of the video I can follow, and I'm sure I could get the other 5% if it were spelled out, so to say. I guess, what might help is if you "walked" us through EXACTLY what is happening through the initial function call, then the next and then maybe even the next. For example, what does this resolve to: .filter(c => c.parent === parent) on the first call? (I'm pretty sure the answer is null, but you don't spell it out) What is happening here: .forEach(c => (node[c.id] = makeTree(categories, c.id))); When I ask "what is happening?" I'm asking what are the value of "c" at "c =>", "c.id", etc. This would be extremely helpful to know. Also, you might want to explain a little about the stack so the beginner understands why the values for each successive function call are not lost. Think of it this way: how many times did you make this video? I'm guessing only once. But for most things, code, for example, improvements can be made with revision. Refactoring they call it. This is hardly ever done with teaching lessons (and there are special reasons for that). Do you think this video can be improved upon? Chances are, the answer is yes. Never trust your feedback in the comments. The people who understood will offer encouragement. The ones who didn't understand will feel too embarrassed to say, so you're getting a very skewed set of data. There are very few people like me who will tell you where you can find areas of improvement. Why? LIkely because who is going to take the time? What will the results be other than hurting someone's feelings (not at all my intention).
@@DanielRLuke Thank you for specifying! I generally do what you suggest in recent videos. Might re-do the recursion video in the future using Quokka (quokka.funfunfunction.com)
@@funfunfunction Maybe they will sponsor your effort?
i liked this video alot, you are very upbeat and energetic!
My classroom experience with recursion was ... I think with sorting alphabetically. I remember enough that I could mostly understand this episode, and appreciate the review. :)
i am coming from OO (i am a C++ developer). this is fun, learning a new way of thinking about things. learning both paradigms can only make me a better developer. we also use recursion for our scenegraph nodes in our codebase.. was trying to profile some code involving that today.
Thank you! Love your style.
Great course, another way point of view to learn the new js language :) thank you
The music in the background really makes it feel fun!
I love your channel! Just I have to say it, everything can be implemented with fors. You can implement your own stack in an array to know the pending nodes to process. Of course, it would be much much much characters long (to use the metric of this series) and really more complex and bug. I think this little lie is perfectly worth it for the clarity in your explanation.
+Javier Dottori yeah, this is correct. I should have probably said suitable/convoluted or something instead of impossible.
thanks for the tutorial, man. great content!!
These videos are SO good! Thank you!
no, thank YOU!
I love "Fringe"! Such a good show. Haha, great stuff, Mattias.
Another great video. I need to work on my recursion skills.
Some times just I come back to the videos for the good vibes and energy even though I already know the topic. idk it is just cool hangin with you
I used to work with scientists, helping to manage data, and this involved loading data from several files into a single report, or vice-versa and everywhere in between. (a great way to learn Python)
Then one day, I discovered that there was no regular pattern of where the source files would be. Recursion to the rescue.
btw, I'm circling back to these videos after that work experience, and they are the best evar. Just recommended your channel to a co-worker.
+David Williamson hey David, glad it's useful! thanks for the kind words and spreading the word about the channel.
Thought it would be interesting to continue this episode by showing how you can create another recursive function to flatten the tree back to the original array.
You are the best teacher ever!
Nice example on how to apply the concept. Most of the explanations I came across didn't provide a use case. Thanks!
I love it when you use humor to explain things 😄
I've clicked "like" on all of your videos that I've watched so far (because I really like them :)), but this particular like is for mentioning Fringe! :D Awesome content!
Thanks a lot, mpj... love this video.
I wish I had watched this before all the whiteboard interview with recursion and Fibonacci. This is great stuff
Good one mate! Thanks!
Great explanation!
funfunfunction your the best, great show thanks a lot ...
That makes a lot more sense now. Thanks
Wow! You nailed it in terms of explaining recursion.
I was thinking why not use loop e.g. while () when you explaining when you flash the recursion code,
and you explain it the next moment
Thumbs up and subscribed from me!
I really appreciate these videos! Thanks from the future (:
Tack som fan för detta klipp!
Thank you for the explanation.
5:11 Love the Final Fantasy reference!
Brilliant this one !
Man I love your video!!. Ive been watching you since I started programming 4 years ago. THANK YOU so much for all your hard work. My only beef is I really don't agree that let is the new var, it kind of feels like the whole == or === debate.
I've only had the channel for two years tho. :)
I have learned so much from your series, watched them all. Thanks for making them! So in this video would reduce have also worked as another solution to the problem. Trying to gage if I'm understanding correctly.
SUPER good question. The fact is that when you implement reduce, you use recursion to do it. If you look at the source code of reduce in major libraries such as underscore or lodash, you'll see them using recursion!
Ahh that makes sense! Now I get it!