JavaScript Array Reduce Method Practice in 5 Minutes
HTML-код
- Опубликовано: 5 янв 2021
- Learn to use the Reduce() function to convert an array of items to one output (ex. sum of items in an array).
Arrays are an essential part of JavaScript. If you want to get better at JavaScript, you have to know how to effectively use arrays, especially the built-in array methods like map, reduce, filter, sort, every, some, etc. In this series, we'll cover the JavaScript array methods you need to know to become a web developer.
Array Worksheet - bit.ly/jqq-array-practice
Join the 💬 Discord Server 💬 - / discord
_____________________________________________
Newsletter 🗞
Interested in exclusive content and discounts? 🤯 Sign up for the newsletter!
www.jamesqquick.com
_____________________________________________
Connect with me 😀
Live streams on Twitch - / jamesqquick
Follow me on Twitter - / jamesqquick
Join the 💬 Discord Server 💬 - / discord
_____________________________________________
COURSES 💻
Learn how to build Fullstack apps with React and Serverless Functions - www.jamesqquick.com/courses/r...
Learn everything you need to know about Visual Studio Code - www.udemy.com/learn-visual-st...
Build a Quiz App - www.udemy.com/build-a-quiz-ap...
Love the third use case 😻
instaBlaster
Just what i'm looking for. Great work. I'm a looooonnnnng time SQL programmer and new to javascript (which is my new retirement hobby). I was always wondering how in javascript to do a simple "Select EyeColour, count(*) from Characters group by EyeColor". This has opened my eyes! (Which are blue by the way if you need to add that to the data set. 😁)
5 minutes well spent. Great video. Concepts from functional programmers should be in every developer's toolbox! Thank you for making this! 🙏
Thanks for making these short videos. They're very helpful.
I love the way your simplify difficult topics in a manageable way
Excellent video.
Suggestion 1: Turn off vs code intellisense so the popup does not cover your code.
Suggestion 2: Put the terminal on the right
Suggestion 3: run 'nodemon worksheet.js -q' to hide nodemon status and clean up the console
Great stuff! I'll always go back to this playlist!
Flawless explanations! thank you
Great series on the JS array methods, thanks!
This was quicker than ‘looking it up’ thanks 👍
First time watching your vids - this was an easy sub for me - really love your vids and explanations - it has been helpful - thank you
Thank you for explaining this so clearly and concisely.
Glad you enjoyed it!
Well explained thanks.
The eye color example was really good, thanks
I gave you a thumbs up. The video is mostly clear. I wish you would have explained why you started with an empty object. With that being said I have seen several examples of using the reduce method with objects and this is one of the more clear explanations even though I do not understand why you start with an empty object.
Very interesting, good video, thanks a lot
The best video I found with Reduce() examples. THANK YOU SO MUCH!!
Yayy!
Hi James Q Quick , your tutorials are simply awesome, In reduce function example the output of totalMass producing incorrect result(0497784136) , we have to apply parseInt to curr.mass i.e characters.reduce((acc, cur) => acc + parseInt(cur.mass),0). so that we will get correct result(346). Thanks for your Great Tutorials.
Helpful, thanks!
parseInt() or Number()
Thank you man, I was struggling with that number.
This and the map vieo were helpful - thanks! I forgot to sub to your channel when I saw your video on Brad Traversy's channel.
Thank you so much sir💯
Great videos! Thx man :)
PS color theme do you use?
I remember back in August I couldn't get my head around this.
Is it making more sense now? :)
@@JamesQQuick Yes, I fully understand the Array functions after going on Codewars!
Back again for a refresher; by far the most extensive tutorial on this topic
Yasssss!!!
Yet another awesome video!! Love the explanations because they are so easy to follow.
Greetings from Bulgaria. Thank you for your time and efforts to put those wonderful tutorials.
Please, tell me in the case of eye colors, how that object got miraculously arranged into those exact key value pairs, since nowhere you specified that ?
Thank you.
My English is not very good but I really understand it with your explanation, I like your style in explaining and the font used is quite pleasing to the eye with an explanation and a font size that is very suitable and comfortable to see and hear, awesome .. I hope you explain more in detail like this and more tutorials about javascript on your channel cz this tutorial is great!
So glad to hear that :)
if you downloaded array from github, you should convert mass from string to number for it to work: +acc + +cur.mass
Thanks
I wonder the people giving thumbs down for this lovely easy to understand video 🤔, can we see something better from you lots giving thumbs down then.
Lol thanks for the support!
Wow! Thanks a ton. Can you please make a video on how you've customized your VS code and zsh?
I’ve got a video covering vs code. Terminal comes from the command line power user course by Wes bos
ty
how can i find more challenges ? thank you!
🤯🥳🥳🥳 eye color example ,and yes am a beginner
Ditto.... Sorry to sound like a broken record. But another great video ;)
Thanks. I'd like to see more advanced stuff in js :D
Any specific suggestions?
@@JamesQQuick closures maybe??
@@majdeddinebentahar5434 Ooooh that's a tricky one. I'll think about that one! lol
Can you please make video on generators function
Please do classes constructor function functions,factoryfunctions
nice, the biggest "aha" moment for me was realizing you can set the initial value to be an empty object
Can you show how to sort an array of strings case sensitive? e.g. Luke, leila, Darth, yoda
do u have an explanation for react plz??
is there a reasone not to use syntax like: arr["index"] = (arr["index"]||0) +1; to handle initialization of unused indexes to skip the if else?
You can. But not easily readable.
What's the name of your font sir?
I don't understand the eye color " if (acc[color]) " this if statement checks if color exists right? I don't understand how it decides to count the same color and don't understand the false statement either if color doesn't exist then you set color to true? this if statement is confusing.
thank you so much but i have a doubt , instead of ""curr.mass'" can we write it using destructuring if yes then how?
Sure. const {mass}= cur;
What's the name of your theme sir?
Wondering if you can return values as arrays and don't return duplicates:
{
eye_color: ["brown","blue","green"]
}
Should be simple enough. Would be easiest/fastest to just use a set that stores colors as the accumulator, but you could do it with an array using similar logic to what he did in the video, just checking the color array in the accumulator and adding the color if it doesn't exist yet
Can anyone clarify why acc[cur.eye_color] works but same with dot notation acc.cur.eye_color doesn't work??
acc[cur.eye_color] -> something like acc["brown"] so it's getting the value associated with the key of "brown" where as acc.cur.eye_color just becomes the color itself.
Hey,i have put every bit of effort to figure out what am i doing wrong, but i am getting this number as total of mass .I have rechecked countless times, i have the exact same code but with different number.
Same....
need more class
map and reduce are such bizarrely named functions...
niced
Dude, over 10k views but only 579 likes? That dog won't hunt.
I just have a problem, my values are concatenate. I try with Math but nothing =(
Use parseInt() or Number()
eg:
const totalMass = characters.reduce( (acc,curr) => {
return parseInt(acc)+ parseInt(curr.mass);
},0);
@@uchichaobito607 Thank you
to difficult for me.. :/
I LIKE YOU PJ'S!!!!! if they are pj's
Haha not pjs but I appreciate it
Me again, I forgot it all :D
Fuck no dislikes yet 🙄😯 is it a sign to hope in humanity again?😁
Hahahah maybe so!
I was the 69th like, nice
Bahahaha
Not sure if maybe something in JS has changed since this video but for totalMass, I kept getting 0771364984 so I knew it was being concatenated as strings so I tried commenting out 'use strict' and also tried taking quotes off the numbers in the characters array but the only fix was wrapping cur.mass in Number() in the return. I'm sure parsint etc probably works too Just incase someone else has this problem and is spinning their wheels.
in the code the typof mass is string, you should use + before curr
The Array Worksheet - github.com/jamesqquick/javascript-array-functions-practice
Thanks for grabbing that
Theres a great chance that things have changed in the 2 years since this video posted, but when I try to work along, I get a long string of numbers instead of the sum total:
const totalMass = characters.reduce((acc, cur) => acc + cur.mass, 0);
console.log(totalMass);
0771364984
I think that means that one of your inputs is actually a string. Are you sure cur.mass is a number and not a string?