Has AI melted our brains? Dev Cardio Challenge!
Chapters11
Implement sum of an array with a safe starting value for empty arrays and use reduce to accumulate the total.
A tongue-in-cheek coding challenge where devs race to pass 10 array-manipulation tasks, revealing quick hacks, missteps, and hard-fought wins.
Summary
Syntax’s Dev Cardio Challenge pits Wes, CJ, and teammates against a 10-task array problem set. The banter is brisk as they tackle sum, remove duplicates, partition data, and lookups by ID, all with live debugging, off-the-cuff fixes, and strained humor. The crew debates using reduce with an initial value, preserving order when deduplicating, and how to split arrays into chunks or group by subjects. Throughout, the tension cycles between ‘we’ll figure it out’ and ‘we passed the test suite first.’ Wes pressures the clock, CJ’s rapid-fire iterations push progress, and the team celebrates a win while admitting where they stumbled. The video doubles as a playful study of problem-solving under time, showing real-time decision making, regex experiments, and TS/JS type considerations. If you enjoy live debugging and mic-dropped wins in a casual dev battle, this is your vibe.
Key Takeaways
- Using reduce with an empty array requires an explicit initial value (0) to return 0 instead of undefined, as demonstrated while summing an array of numbers.
- ],
Who Is This For?
Essential viewing for JavaScript/TypeScript developers who want to see practical, battle-tested approaches to common array problems, plus the friction and improv that happen in live coding sessions.
Notable Quotes
"Sum an array of numbers. Oh, that is easy. Uh, return. Um, can't spell return. Oh my gosh. Return the numbers."
—Knee-deep in the sum task, illustrating confusion and the chaotic humor of live coding.
"I finished 28 minutes ago."
—Wes brags about finishing early, signaling the friendly competition vibe.
"Wes, you win."
—Final moment of the challenge where the winner is declared.
Questions This Video Answers
- How do you implement a sum function with Array.reduce in JavaScript while handling an empty array?
- What are practical ways to remove duplicates from an array while preserving order in TypeScript?
- How can you implement a partition function that splits an array based on a predicate in JavaScript?
- How do you group rows by a key in TypeScript and then extract top N items per group?
Full Transcript
array cardio. Can us brain deadad developers still write some map, reduce, filter, sort, unique, all of those hard things around working with data? We have 10 different array questions, a whole test suite ready to roll. We're going to see if we can implement them. And whoever gets the test suite to pass 100% first is the winner. 3 2 1, let's go. Okay. Um, sum an array of numbers. Oh, that is easy. Uh, return. Um, can't spell return. Oh my gosh. Return the numbers. Reduce. Oh, why is my Oh, wait. Wait, wait, wait, wait, wait, whoa, whoa.
Did somebody do a countdown? I said 3 2 1 go. Okay, already started. Wes is going. So, I haven't started. Oh my god. So, that should uh solve sum reduce of an empty array with no initial value. Yeah. So, we need to start this off with zero if it's an empty array. There we go. Sum is passing. So, we have numbers for each Wait, why am I doing a for each here? Let sum is equal to zero. Who cares? Whatever. This is how I chose to do this. Okay. Okay, we're good. We're good. Okay. Um, so return, we're going to return the numbers reduce a and b.
From that, we are going to simply return a + b. We'll start with zero. Give a save. Boom. Boom. Boom. Pass. Okay. Next. Next up, remove duplicates. Now, you could just throw this into a set, but I think what I'm going to do is create a set and then iterate and filter. So, that way they keep their order because a set will change the order. So, we'll have the unique will be a new set and then uh for each one items. We get each item and we'll say if unique dot has i return false. But before that, we need to put all of the unique values in there.
Actually, there's an easy way to do that. uh will uh spread items into the into the unique set. Oh, I think I don't I don't have to spread it. I can just call it like that. Yeah. So, we have it. No, that's not going to work. It's just going to be like the first occurrence of it. Wow. Why is this so hard? Okay. If we spread the items, possibly. No, we just say new set of items and then return data. Does that do it? Oh, it's returning a set. So, what if we did Can you spread a set or is there two an array?
Okay, perfect. Uh the reduce is reducing down to an array and we'll say if uh unique has that given value then we just return the result as is. Otherwise uh we'll push that value into the result and then return the result. Um and then result is an array of uh of t. My result has one two one two one in it. Oh, because I need to I need to actually add it to this to the set, of course. So, if it doesn't have it, then we do unique add value. That way, next time around, it won't have it.
There we go. Passing. All right. Partition. That took me way too long. Partition. All right. Uh, split elements that satisfy PR versus those that do not. What does that even mean? Split. O, those that satisfy PR, which returns a boolean. Uh, why am I I'm I'm creating a new array. So new new r is equal to and then we have the r do for each and for each of these things we're going to have item item inside of here and we're going to say if and we're going to run pred as a function. My code is flashing left and right.
Why is it flashing VS code? You crazy. All right. Uh return the user's name for ID or null if not found. We got users coming in which looks like an array. Okay. Oh, that's easy. Okay. So, we'll do is a const user is equal to users.find where the user user do ID is equal to the ID then return user.name or null. Boom. Error. Transform error. Oh, period. Boom. That one passed. All right. Moving on to running total cumulative sum at each step. Okay, so we have values. I have to I'm going to have to look at the test for this one.
So if you call a running total with five, you get back five. If you call it a running total with 1 -2, 3, you get 1. And then 1 + -2 is - 1 and then -2 + 3 what cumulative sums. So returns the name or null. So uh we want to name or null. We want to find name by ID. So we want to have uh users do find and then user and we'll say return user do ID is equal to ID. Okay, returns name or null. Okay, Bob should be so user ID is equal to the ID.
Uh that should we should return this. Um, what does it actually return the user's name? Okay. Name. Bingo. No. Okay. Finally. Jeez. Okay. What's the best way to do this? If the title starts with Oh, but no. We We essentially just want to replace anything that starts with the or. Do we want to rejax it off? I think so. So, anything that starts with man rejax the or and console title without leading. That didn't work. You know what? Screw it. I'm going replace the with Oh, wait. I forgot to put the actual value that we're going to replace it with.
That didn't work. Okay. So we get an array with all of these objects and then we need to group by. So we're grouping by subject. So that's that's step one. Let's call this top and this is going to be just in object just map just for each over these. So for each row um we'll say if and so top is here comes some type script. Okay. So this is going to be a record where the keys are all of the rows subject. I guess I could they they're just strings. It's just strings. So record string this.
It's this this is our type. I can just copy it and it just starts off as the empty object like that. Beautiful. Now for each row if the uh top at row subject does not exist, then top at row subject uh equals just an empty array. Well, an array with that row and yeah, just an empty array. And then we push the row in. So this is going to give us an object where each of the subjects are the keys, but then we have entire arrays of everyone, but we only need to grab the top in amount.
So instead of pushing every single one in, I think we'll we'll push all of them in and then afterwards we'll and I don't need to return this. So this this is basically just create a top. Afterwards, we go over each of the subjects. So I'll do like object dot uh keys top and then for each one we're going to modify this this thing. It's going to give us each subject uh the top at that subject is going to be equal to itself sorted on score. So a and b and then we uh slice that to grab only the top in and then we return the top.
Oh, we don't include the subject on there. So, uh, here's what we do. Whenever we push these rows in, we just grab the score is going to be row.score and the student ID is row. student ID, but otherwise that passes it. Sweet. Uh, for one of them, the other one it doesn't. A splitter into consecutive chunks of length. The last chunk may be sorter. What does that even mean? Oh, so Oh, I see what it's saying. Okay. Um so we want to say uh oh god we want to say we want to return we want to construct this array.
So that means a good idea to construct this array would be h well we want to split this into buckets. So we want to split array every uh two items. Oh my god. Uh, so you could just straight up do R do for I'm just going to I'm just going to do this item and then um actually we're going to get the I2 and then we're going to say Oh god, how do you even do that? All right, screw it. I'm coming back to this one. Uh, split an array into consecutive chunks of Okay, good.
Give me this. Okay, so console log, we have an array and we have a number. What we want to do is return the array. and we want to reduce it. Let's start with an empty array and then for we got the accumulator but then you have the value and for each one we want to return an array which is we simply just want to return the value and slice from the yes slice from zero to the number. Uh, no. We want the accumulator to push that. What's val? Oh, all right. We're doing a for loop now.
We're on We got two left. These are hard. Uh, we have dock words. So, word sorted list of document IDs that contain that word. Each ID once per per word. I'm going to have to look at the test like what what does this what does this want? we have an array of doc words and then we're putting the keys to be all of the words and then which document they occurred in. Okay, so same thing we're going to start off with the result is just an empty object of this type and then we'll iterate over all the docs to put um each of the words in it.
So we'll just do docs.for for each we get each doc and then result we'll say if result at doc dot is the doc ID or no we want words we need to iterate over the words um why why am I so why am I uh having such a hard time with this folks if if new chunk exists uh then push an item into it otherwise eyes. Why can't I create this three? Okay, so mine is off by one. I mean, do I just do this after the fact here? That fixes it. Okay, splits into consecutive chunks.
Splits into consecutive chunks. This is stupid. If r.length is equal to zero, I'm cheesing this one. Sorry, guys. This is so dumb. All right, return. I think we're just returning an empty array. Or what are we returning here? What does it need to return? Uh, chunks. Chunks. Chunks. Chunk chunks. Okay, did that finish the chunks one? Okay, so we have bird doc 2 cat includes doc 2 and it should not Oh, they need to be sorted. That's weird. But I can do that very easily cuz after all of that push it and then sort it on a on a and b.
Why is it in Why does it have to be in the right order? Um, we'll do a.local compare with b. Yeah. Okay, that got it. All right, last one. I don't know how the other guys are doing, but I'm doing great. Well, an array where I know these I know this states ordered by total population descending each entry list that state's names. Right? So, we get a list of cities and then um we need objects unique objects of uh just the state. So, first let's just accumulate. Yeah, we need to accumulate all of this into um objects that look like this.
So, we're going to third verse same as the first. We have the result starts off as an array. I kind of want it to be so I can easily look it up. I'm going to actually do it as an object of arrays. So, here's our type. Basically, I want a record where the key is going to be a string, which is the state, and then the value is going to be that array of things. Cumulative sum at each step. So, what is this looking to return? So, if the input is five, the output is values.
Okay, input is five, output is five. Okay. So if the we want to then do a map where we do val where each val is going to be the to the running total. Let total is equal to zero and we're going to say val uh plus total. Okay. And then we want to return that. Boom. What? What am I looking at here? Chunk go actual undefined. You're looking for a nested array. Of course. What is wrong? Oh, I forgot to put a return there. Still didn't fix it. Array. One, two. Oh, slice is not it.
Is it splice? Yes, splice. Okay, next uh because we will iterate over the city. So we'll do cities.for each and then if uh result at that citystate is not a thing and we create it and um it's going to be it's going to look like this where the city.state is here total population starts off as zero and then cities starts off as empty array. Um why is this complaining? state does not exist on type. Oh, no, it's not an array. It's just a thing. Okay, there we go. So, we do that and then we say result at citystate dot total population plus equal this given city.pop population.
And then we also do result citystate dot cities. We're going to push in that given city name. Yes. And then we grab all of the uh values. So we'll do object dot values on result and we sort them by population I think. So we'll do a dot total population and we're going to we want them greatest to least. So we'll do b total population minus a total population. Done. Oh, not done. Okay. So close. Um actual looks good. Again, we need to sort the cities inside. Oh, that's so silly. Okay. But right here, after we push in the city name, we sort them.
We get A and B. Oh, my heart's racing. I want to be the first one to win. Okay. A and B. And we do B.local compare. Uh, we do cities.sort. B.local compare with A. Oh, what did I get wrong? Okay. No. One of them is alphabetically sorted and then the next one is not. That is tricky. No, it's A. It's A to B. Okay. It's A to B. That's why. Done. There we go. Done. Oh, did CJ finish? He's so good. My VS Code is just like flashing like a dang uh arcade. Um, now that's great.
Now return. Take the top end. End scores. The top end first. It sorts the list of document. No, don't use AI. Oops. Oh, no. No. Stop. I pushed the AI button. Don't. That's not allowed. What does that even mean? Which is so painful. Where the def. Okay. So, Wes, you win. Okay, Scott has given up. Wait, hold on. I am victorious. How many did you finish? Let's just say that. How many did you finish? Unmute. How many passed? How many did you get past? I have one left. That's not Okay, then you did get second.
Congratulations. But yeah, I don't want to make you guys feel bad, but I finished 28 minutes ago. You blew through it. So good. We need somebody in the comments to make more of these for us. Um cuz like I use Claude to generate these based off of some previous ones that I've done in my courses, but I would like an actual dev. So if you're love weird stuff like this, leave a comment below. And if you want to give these a try, let us know how you did. Uh I don't know my exact timing, but 30 minutes faster than these guys.
So, how did you do?
More from Syntax
Get daily recaps from
Syntax
AI-powered summaries delivered to your inbox. Save hours every week while staying fully informed.






![[LIVE] TANNER LINSLEY: TanStack Start, React, AI Agents, and More thumbnail](https://rewiz.app/images?url=https://i.ytimg.com/vi/AQOPaHHYQFk/maxresdefault.jpg)


