JavaScript Higher Order Functions & Arrays

[@sonnyps413]

Timestamps - ForEach() - 3:25 - 5:30 Filter() - 5:30 - 15:30 (8:55 One liner filter code) (filter will returns an array - meaning you do not need a separate variable for an array) Map() - 15:45 - 21:05 (20:30 You can link multiple Map() like .then() from promises) Sort() - 21:10 - 25:50 (Takes two params) Reduce() - 25:50 - 30:55 (Reduces the array to a single value - from LEFT to RIGHT) Extra : 31:05 - 33:40 (Combine all four methods)

[@curiosdevcookie]

Thank you,

[@JD-kf2ki]

thanks, dude

[@simple8810]

@afreen khanum Nah, forEach loop over an array, and it only gives us values when we defined specific conditions for that, e.g ages.forEach(function(age) { if(age>30){ console.log(age) } }); so it only gives value which pass the condition but in filter ,it will make array of these values which pass the conition and for each doesnot return anything while filter return a new array depend on the condition

[@Dejan-f6m]

Appreciate it

[@OmarBugarin]

I just recieve my first pay working like a front-end dev, and i buy your course, becouse i need to be better with js and becouse thanks to you i got my job, thanks man youre the best teacher, if one day you come to México, youre welcome in my house!

[@caioferreira3308]

Really, nice man congrats, i wanna a job as a full stack and i will get by brad classes

[@nrg7685]

@stillFLiP i just wanted to ask the same. Because in my country we have requirements like 5years work as a developer. Thats insane

[@PB72UK]

Tamás Mirják just build loads of stuff, even small spas and single webpages that show you understand a certain concept, this will help your job prospects..

[@raboija]

that's nice

[@unknownman1]

what is your salary ?

[@HariramNandagopal]

RIght now I have reached a level where searching for a video within "Traversy Media" channel seems to be more bliss than searching whole KZbin. Top class Brad :)

[@TraversyMedia]

Thanks :)

[@Nemcoification]

Lol, same here. My preferred google search on a topic is now "Traversy (topic)". That says a lot :)

[@ChristofferHald]

@@Nemcoification Funny to read this comment. I have done exactly this the last two weeks.

[@devonrusinek5807]

@@Nemcoification Same here

[@curiosdevcookie]

Well put, same here!

[@boristheblad]

Those "Now put it on pause and try to do it yourself" are gems in your videos man, really helps to learn!

[@troytempest3023]

Brad, honestly speaking you're by far the best source of not only quality and useful programming info but your explanations and comprehension of these concepts and their application is really great and very easy to understand. Thanks for the amazing content!

[@thelearner8809]

#JavaScript #varible #constant Coding వ్రాయటం Start చేద్దామా? JavaScript Fundamentals || Lesson2 || Variables || Constants kzbin.info/www/bejne/sKvIiKeCpruEiM0

[@zachaluza3410]

I've been struggling with these functions for a while, and this video really helped!

[@indiancuriousvoice8773]

I am from India and I can say your teaching way is better than our IIT teacher.

[@ousmanebocoum221]

Actually understanding those basics should be what people focus on, instead of learning frameWorks and libraries without knowing what is going on under the hood..once again thanks, Brad!!!

[@TraversyMedia]

agreed

[@ubozoharinze8869]

I am being forced to learn angular in my new company but a friend told me to move to basic ts and js which i can say is really helping me out blindly learn frameworks is bad

[@thevoiceofgod7454]

Thanks For the great tutorials, they are so helpful, I had my first developer job interview, needless to say, I don't think I'll get the job, but what I have learned through practice and watching your tutorials was tremendously helpful during the interview process. First code test I passed easily, second code test was much more difficult and I couldn't figure out the code but I was able to figure out parts of it. Seriously thanks for the tutorials. For those of you out there just starting out, looking for your first developer jobs, the JS test I was given consisted of an easy first test, basically just asking basic questions about identifying operators, for loops, switch statements, what are objects stuff like that. The second test was to write a function where I had to figure out how to find words in a given sentence/string that contain a specific character and output those words that start with that character and then reverse the words. Didn't do so well on the second test.

[@kissromeorichard]

Brad, your way of explaining abstract things like functions suits well to many, many future programmers. A humble thank you! PS. And also your voice and tone is really soothing for people who want to learn.

[@davidvideauortega287]

Your tutorials are out of this world. You explain every single thing, what makes them really easy to follow and begginer-friendly. I can't thank you enough for that! I'm a huuuuuge fan of your work :)

[@othmane2493]

I really don't get how can ppl dislike a video of a guy who gives them some knowledge for free ... like how ??

[@f12736]

Maybe by clicking on the dislike button. 🤔🤔

[@oliverharan5256]

so the only reason I would recommend this or anything that Travis does because he's the real deal... He records these videos and does paid udemy courses at the same time.... That's big time... his courses are well worth the subscription but he goes above and beyond with these vids for us.. it's all about knowledge. .. So rare.

[@LaurenceBahiirwa]

Thanks Brad for this. I was preparing a lesson for my Cambridge students. This helped greatly. Keep it going man.

[@davlatgulomxusenov2031]

are you a teacher of Cambridge University?

[@deependrarathore283]

I am newbie and learning coding . I have questions here , we are passing company as parameter but company is not defined anywhere ?

[@vainav5794]

@@deependrarathore283 if you talking about the 10:10 time stamp here company is just a parameter just like passing paramters like x,y in a function this is possible in javascript unlike lang like c++ and etc here the values from the companies array is stored in company variable as it loops through all the object ppresent in the companies array i think this is the coorect explanation corect me if iam wrong

[@sarahrudy8292]

You are SUCH a great teacher! I found you through your course Modern JavaScript from the Beginning and these youtube videos are just the icing on the cake. Thanks so much for spreading your knowledge!

[@ITSH4WK]

Great examples. I love how you break things down and then show simpler ways of getting the same results. Really helpful. Thanks, Brad

[@sumgue4964]

This was really the only acceptable tutorial on javascript arrays on youtube. I was falling behind in a programming bootcamp I am currently attending and this saved the day. Thanks a lot!

[@EricBishard]

Really good video. I'm a 10 year JS dev and work with JS everyday and courses like this are required to simply stay sharp! Nice job..

[@MrAlamazin]

As a self-learning student of JavaScript, I am grateful for your content. Your explanations are clear and your voice is sooo calming! LOL. Thank you fine sir!

[@ajaybayya]

Thank you Traversey, your content inspires a lot to make my day to day work better.

[@matthewmcmorries7600]

Software student and first time watcher here. You did a phenomenal job of breaking this down so a week 4 student like myself could understand.

[@TheFallinforyou]

For an even shorter way of sorting the Company starts: const sortedCompanies = companies.sort((a,b) => a.start - b.start);

[@awaisfiaz8186]

yeah right explanation link. www.w3schools.com/jsref/jsref_sort.asp

[@Adamsandlerwb]

@@awaisfiaz8186 Ayoo Chaadd chill broo ahahhahaha!!

[@tunamusic2314]

do you know why when we use sort(a,b) => a-b and it will arrange from short to hight value ??

[@kevinzhang8974]

get up @ 6:00 and did this tutorial ... it is a fantastic exercise to massage my brain before I jump into real JS coding today... Thank Brad for the excellent video

[@ScottGrovesBrainDump]

Brad, just love this video!!! Really great examples and soooooo well explained. Really like you testing us by asking us to pause and try ourselves. Makes it so interactive. Thumbs up!!!

[@rubenverster250]

Hey Brad. I've been watching you since the start of my career, when I was a Junior. The time has come where I have outgrown your content. I appreciate all the help and tutorials you've given me over the years. Now you are helping me in explaining these topics to other Juniors :) Thank you

[@websurfer5845]

Man, thats one of the best videos. make some other javascript videos , its one of the most famous languages out there. So please share with us the most important things u've learn doing javascript throughout your entire programming life

[@peoray]

Have you tried the course?

[@peoray]

How would you rate the course?

[@AoifeNic_an_t-Saoir]

Shatov his courses are all great, especially the ones on Javascript. He not only knows what he's talking about, but he also knows how to teach it in a way that we can understand.

[@baybay1234]

yeah check out his courses on Udemy if you'd like to show some support to his great content :)

[@konstantinkkk8397]

Web Surfer pls tell me how to find his tutorials on udemy

[@ninopotskhoraia5373]

I never hear any banging or yelling which you are apologizing for in your videos. You have nothing to apologize for sir. Your content and teaching style is unmatched with. You have taught me so much. Thank you for your awesome videos.

[@AlexandrKalaidzhi]

ES5 callback syntax for filter function can be shorter without using if statement: const canDrink = ages.filter(function (age) { return age >= 21; }); The result will be the same. But ES6 is really cool. Thank you for the great lesson.

[@tunamusic2314]

ok

[@daviddrahllensa4165]

My native language it´s spanish, and i understood better than people that explains on spanish. Thank you so much, great teaching.

[@argeelearner3978]

On your way to 300,000K, Good for you. Your the best!

[@BobbyBundlez]

omfg ur explanation of how if only one parameter is in fuction then it doesnt need paranthesis cleared up SO much for me, thank u

[@ernestj8000]

Excellent tutorial and pacing. Thanks for recording this. Truly one of the best explanations of these array methods that I have watched.

[@miggu]

Thank you for explaining things calmly , orderly and easy to understand.... so hard to find to find people with this talent .

[@willadams6217]

Really good video I followed along and added it into my modern Javascript course directory. One thing though you keep saying squared but the Math .sqrt() is the square root not squared.

[@01107345]

squar't

[@AnaCastro-zp5cr]

This video is hands down the best one I found explaining high order functions & arrays. You basically thought me in 35 min what 5 hours of Lynda courses couldn't. Thanks, u da man!

[@pikachu5223]

Thank you! buy brad js udemy course is gold

[@achivers8]

Kali 33 hi, is it the modern JavaScript one or any other js course

[@pikachu5223]

Abdul Gafoor the modern one

[@b.naveenkumar7662]

Traversy Media is the best programmer in my life :) very nice line by line explain

[@MrSuperawesomeisme]

Very well explained! Thank you. You must have accidentally mixed up square vs square root though!

[@Hi-Five-Ghost]

Brad is the GOAT 🐐 . I’m taking an online bootcamp and they totally skipped over the ES5 and prior. Which makes sense as to how it works. They just dove straight into ES6 which doesn’t make sense unless you know the older syntax, for me anyway. I love you brad!!!

[@CaneSugarHD]

The for loop you can easily do away with "i" or array tags completely by using (for of) loops for(age of ages){ if(age >= 21){ canDrink.push(age) } }

[@childmolester6557]

stfu or i ll give u 3piece and a java

[@tunamusic2314]

i see ( for ...in ) , means for (age in ages) and don't see (for of ) like you said

[@lets_lvl_up]

I mean, it's better than the old fashioned 4 loop. Actually you can even get ride of the curly brackets: let canDrink = []; for (age of ages) if (age >= 21) canDrink.push(age); But doing it the way it's shown in the video is still more succinct: let canDrink = ages.filter(age => age >= 21);

[@karimakatonkarinakaton9608]

0

[@ssk7690]

Man you've got no idea how much you help a person in need. God bless you!

[@captainalpha4853]

Hi Man , please keep doing tutorials videos , i love 'em a lot 😍😍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍

[@dovenobertinca4029]

Oh Man, you are more than capable of explaining, not of the best, but the BEST of all time. Believe it or not, high paid webmasters do not have the skills you have.

[@FrancoBaccarini]

Hi! Love your content and style. Can't afford to become a Patreon right now, but someday i will. The only way i have to pay your content right now, is with three suggestions for VSCODE :) 1) Instead of copy paste a line, you can ALT+SHIFT+DOWNARROW (or UPARROW). You can do it without selection if you need a single line, or select all the lines you want (SHIFT + UP/DOWN or MOUSE selection.) :) 2) If you need to move the line, just press ALT+DOWNARROW/UPARROW. 3) emmet is enabled by default. Writing CLG->TAB it's equal to console.log(yourcursorisherenow)

[@reilley4297]

To sort the companies in order of start date: const sortedCompanies = companies.sort((c1, c2) => c1.start > c2.start) You can do the same thing on ages sorting as well. Great video! I learned a ton!

[@golamrabbiazad]

Thank you so much. Your explanation was amazing. lovely!

[@aroshm1682]

Thanks man!! this was super helpful. I always come back to watch this when I'm having doubts.

[@coolarun3150]

Liked even before read the title

[@dimarzio9374]

cool arun Bias. Evaluate the content first. Make the author be better.

[@coolarun3150]

Dimit Lemekh don't worry man. That like is for his effort not for the quality of the content. i hope people like you will give good comments about the content and make him better.

[@alxndrdg8]

looks like you are new here. Those who know Brad, hit the like button first and then watch the video - That's Brad Traversy! He has earned that much respect from us.

[@MRMOTOFOTO]

"MAKE THE AUTHOR BETTER".....Bwhahaha!!!!

[@RobertTodar]

I liked it before I watched it as well :) Now watching it, I wish I could like it again :). Thanks for the great video!

[@bonnieowens9531]

Heading over to Udemy to buy the course now...I watched this to clarify some problems I was working on in another course. This answered EVRYTHING, and made me understand what I thought I knew even better.

[@uwspstar2008]

thanks for sharing this one!

[@fastsolution]

This guy is absolutely not boring and voice is soothing.

[@nyteskun]

can some explain how sort algorithm works? is it by a - b, then a - c? or a -b, then c - d? i dont want to just remember how function works without understanding the underlaying operation behind it. its bugging me.

[@RickBeacham]

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort If compareFunction(a, b) returns less than 0, sort a to an index lower than b (i.e. a comes first). If compareFunction(a, b) returns 0, leave a and b unchanged with respect to each other, but sorted with respect to all different elements. Note: the ECMAscript standard does not guarantee this behavior, thus, not all browsers (e.g. Mozilla versions dating back to at least 2003) respect this. If compareFunction(a, b) returns greater than 0, sort b to an index lower than a (i.e. b comes first). compareFunction(a, b) must always return the same value when given a specific pair of elements a and b as its two arguments. If inconsistent results are returned, then the sort order is undefined.

[@MP-mh1tu]

This is the only clearly explained video I've seen about this function. Thank you.

[@GmoneyMozart]

1 dislike from a diehard for loop fan.

[@TraversyMedia]

haha. I have 2 people that dislike EVERY video I put out right around the same time. It could be a video showing how to cure cancer with Angular and those 2 dislikes will be there before 2k views. It's like clockwork..

[@makasilelo1226]

Sorry, did you read my comment on your last post on GO? If not, I think you have to. It's about piracy

[@TraversyMedia]

Can you email me? [e-mail]

[@cowboy8038]

I sent him an email in case you haven't yet, good catch, that is seriously bullshit.

[@makasilelo1226]

Thanks

[@SlimTrackStar]

here we are in 2020 and this makes so much sense. I needed this to understand the .map method, but revisiting the other methods definitely helped everything mesh beautifully. this was absolutely necessary. I can appreciate how concise this was with very simple and consistent examples. thank you. i definitely liked and subscribed.

[@rayc3103]

Can anyone explain to me why the sort returns 1, else -1? How would that result in the companies being sorted?

[@shahrukhtramboo6781]

stackoverflow.com/questions/1494713/how-does-javascripts-sort-work

[@javabeanz8549]

If you look back a very long way, I believe it is coming from Assembly language, where you do a COMPARE command, and there are three possible results, basically -1, 0 and 1, so you JUMP LESS THAN, JUMP EQUAL TO or JUMP GREATER THAN... We are only using two here, because the two values must be swapped in one case, and not in the other, while if they are equal, it doesn't matter if they are swapped or not.

[@sammorpeth5367]

This is such a great video for people like myself who feel like they've plateaued recently. I finally feel like I'm starting to get a grip on arrow functions thanks to this. Cheers!

[@m.h.9927]

Boom ! Boom ! i yet not started watching ,, but know You are a Bless for Poorer People ,,, sorry , i have to go to watch .

[@fredhair]

I'm coming from a C++ background now learning full stack as I'd like to get a job in it and wow you guys using JS don't know you're born! After writing a multiplatform openGL and C++ renderer and trying to set up environments and build systems I don't ever want to hear any web developer complain their job is difficult! C++ is becoming better nowadays but still.. JS is so nice and clean and easy to use even writing predicates for these array algorithms seem way easier lol.

[@gafroninja]

"Sorry for the yelling upstairs". Actually thought it was my baby waking up, upstairs lol >

[@brondchux]

4 years later - Thank you Brad for the refresher!

[@bagaskara1567]

Arrow function is less readable, need more time to understand it

[@JustSujC]

Definitely, but it is technically more concise.

[@eddev]

Personally I read it just the same, I use em enough it’s just as easy understandable

[@dazelmann6589]

Or need more practice to get head around. Get on to work...

[@lets_lvl_up]

Yeah at first it's kinda wierd, but now i think they actually make it more readable by getting rid of the clutter. Hope i don't get bashed for saying this, but they remind my of the pathonic ways xD.

[@stevenedwards9262]

Its a lot more readable, you dont have to declare that the callback is a function, you dont need pointless parentheses around singular parameters/args, and for single-line functions you dont need to specify youre returning something when its already obvious you are. You just need to spend an afternoon sitting down and breaking the pieces down in your head

[@makidelidaki9262]

I love you. I've read tutorials about higher-order functions before and never got them. Thanks so much for this. That will be a boon for my exercises on edabit. Can't believe I finally understand map,filter,sort,reduce and what they're used for + how. So helpful

[@ahmedraza5340]

Watching from pakistan

[@kantyDarius]

From Argentina here

[@hamadyahmed5379]

From Mauritania here

[@gulbadsha]

Programming has no boundries :)

[@awaisfiaz8186]

programming is same no matter where you are so get over it lol :D

[@khoanguyen3044]

Vietnam here

[@ranveerancharaz6732]

This is one of the few videos that helped me understand reactjs well ! Thank you for that !

[@Steve_360]

you said lets find ages squared but used square root function, haha

[@scottvarieur890]

This has got to be the best video explaining higher level JS functions. There are so many potential pitfalls when you learn this stuff, but you covered just about everything in an extremely concise way.

[@djotigergaming1838]

nice explanation but you forget to mention that some of those methods are not supported in older browsers , you say its gonna make you look better programmer , that's wrong , whats true is : "its gonna make you look that guy who don't know how to support all customers platforms". spsly when you mention arrow functions -cause the basic support for arrow functions start in : chrome 45+ , firefox 22+ , opera 32+ ,safari 10+ , android webview 45+ , internet explorer : "not yet" ! - Trailing comma in parameters in functions arrow support start in : chrome 58+ , firefox 52+ ,opera 45+ ,android webview 58+

[@kanonbolt100]

If you're supporting older browsers right off the top of your head instead of using tools like babel that compile your ES6 and above. I guarantee you, you're not getting as much done as you think you are.

[@perc-ai]

you need to use babel, es6 is industry standard now

[@jacquelinemendez3962]

Thank you for this video. I'm doing 100devs right now and this really helps reinforce my reading homework.

[@petixclancoc225]

square != Math.sqrt lol 🤣🤣🤣

[@greencopycat]

Math.pow

[@Marder1989]

one of the best tutorials i have seen for programming so far, very nice job

[@littlealienclub3471]

This video really helped it click for me. I’m using it in conjunction with the eloquent JavaScript book which at times is amazing and at times brain-frying. I feel I have a much better grasp on these array methods after watching this. Will definitely be buying the udemy course

[@leomosia]

Thank you Brad. I appreciate your courteousness in apologizing for the activity in the background.

[@hussainsarwar4252]

If there’s an award for the best and the most decent KZbinr in the world, I will vote for you without having a second thought.

[@LifeSurf123]

This really takes some intimidating looking concepts and explains them simply, thanks

[@Timzge]

broo your videos are the best videos EVER!!!!!!!! like whatever i search about javascript i find your channel and believe me when i say i be pretty sure i will understand cuz you explain everything in a simple but efficient way Keep going : )

[@edhead76]

Your lessons are so straight forward. Thank you for not overcomplicating simple concepts. I don't know why array functions keep messing with my head but this helps SOOO MUCH!

[@anythingtech5711]

Brad, Thank You So Much! 🙏 Through your explanation and walkthrough, I was finally able to understand the structure, what it does, the return, and how to console log-it. I was also able to get it through JS to an innerHTML. This type of video is perfect for beginners like me, I am sure, I'm not the only one! 🙏

[@sharriceowens913]

i also would like to say that i went to your website and it has by far one of the nicest layouts and visually pleasing websites of coding KZbinrs that I've seen

[@Fahdie]

Half way through your video and your tutorial is absolutely magical. THANK YOU!

[@lfrommtl]

thank you so much! im doing a bootcamp and got tripped up on this. pretty sure they explained it exactly like you did but the pacing was too fast for me to grasp the concepts. this really really helped. thanks again!

[@onepiec3]

this is amazing. you make it so much more easy to understand than a lot of websites I've checked them out on. I love how you're always so clear and concise with your words and you've helped me grow a lot with webdev. thanks!!

[@kopilkaiser8991]

I understood the topic of Higher Order Functions because of you. Thank you brother for putting the effort in explaining, thus give insights and passing your exceptional knowledge to the public. My support is for you

[@ivansmrcek291]

Amazingly encapsulated solutions into single-liner definitions of power! Great job Brad!

[@rayna463]

wow this is all starting to click in my brain!! Not too long ago i was convinced it would never make sense to me but i can feel the lightbulbs starting to go off :) thank you for the vids

[@milleniummoses]

The first time I watched this I wasn't ready for it. TOday, I was looking to understand them as I am going through some exercises on freeCOdeCamp. Went to both MDN and W3schoools to no avail. Had an AHA moment and came to KZbin. In the search results I said , "Who can I trust? Who will I understand?" and saw you had a video. All is well now. I think I can call myself intermediate at this point.

[@brunoqgalvao1]

Brad, congratulations on your videos, it has been helping me a lot these past few months. What you are doing here has immense value and i hope you are getting the reward for it. Trying to do my part, i have just become a patron. It's not much but hopefully soon i'll be able to give out more. Thank you very much.

[@johnnweke5547]

Brad. Mannnn. This tutorial is fire. I had been trying to understand arrow functions for a while now! And the whole map/reduce/forEach/filter...this is Simple and to the point. Better than udacity's JS OOP course if you ask me. Gonna be supporting financially soon bro. This is really good. Thank You so much. Best, John.

[@barmalini]

I'm so glad I've never learned the ES5 and the earlier, so less trouble to re-learn old tricks on the new manner! Thanks Brad, bought almost all of the courses with your name on it on Eduonix and you are the best teacher I've ever met.

[@dazelmann6589]

Huh! Then you have just missed the reason why they opted for better approach than previous ones. Plus it's just a syntax difference...in actual computation power it doesn't matter. Algorithm does but not syntax. It's just make your code more concise and readable

[@mamahumen]

No doubt, one of the best and most important tutorials I have ever watched. @TraversyMedia, Many thanks.

[@raducostache8342]

Every time I watch one of Brad's videos, I feel my mind expanding. It's awesome!

[@samrey8134]

How can you not Love this Guy.... Thank you. Dude.

[@jasonwelsh417]

I love your channel. Thank you so much for all the great content. I bought your JavaScript course and I can't wait to go through it for a refresher on some things as well as new learning!

[@harshgupta2699]

Hands down! Great explanation. All the concepts relating to higher order functions are now absolutely clear! Thanks to you!

[@Algebrodadio]

This video was so good, I shared it with some of my co-workers who are trying to learn javascript.

[@developingdeveloper7441]

Sensei Brad. I gotta tell you just made my day! muchos gracias mi maestro!!!! You really have a knack for teaching. I have been having hard time understanding how these higher order function works and it is all thanks to this that I can finally say ES6 and higher order functions are magical and not some cryptic thing that I should intimidated of. Again thank you sir. now I can finaly say this, "Higher Order Function is amazing!!!!"

[@developingdeveloper7441]

and to all of you who disliked. F you!!!! f*ing haters!

[@KochharAmandeep]

Thanks a lot brad! You totally changed me to become a Good UI UX Developer since i completed bootstrap 4 course from udemy. Also your video about your life. I love and always wait for your videos. You are my favorite KZbinr. A reply from you will make my day!

[@ahmedehab6750]

You are a lifesaver, I'm currently learning and I had so much confusion about this topic and your explanation made it crystal clear

[@Solsenderz]

It was a pleasure to watch it and learn from you, it is a clean and smooth explanation of all the stuff.