No BS TS Challenge #2

Let's challenge ourselves to re-implement forEach, map and filter using reduce, and to do it in a type safe manner using Typescript.

00:00 Introduction
00:10 Challenge Introduction
00:32 Solution
06:49 Outroduction

👉 What's my theme? Night Wolf [dark blue]
👉 What's that font? MonoLisa

💢 Watch our other videos:

Thank you for watching this video, click the "SUBSCRIBE" button to stay connected with this channel.

#typescript #NoBSTS

[saurabhprakash]

Thanks for the awesome videos Jack. The solution for implementing filter using reduce is not working. It works when we"type" the reduce function like below.

function myFilter<T>(items: T[], filterFunc: (v: T) => boolean): T[] {
return items.reduce<T[]>((a, v) => filterFunc(v) ? [...a, v] : a, [])
}

If I remove "<T>" generic from items.reduce, Ts gives following error:

Type 'T' is not assignable to type 'T[]'.ts(2322)
test.ts(48, 19): This type parameter might need an `extends T[]` constraint.

Similarly for Map, we need to type reduce as <K[]>:

function myMap<T, K>(items: T[], mapFunc: (v: T) => K): K[] {
return items.reduce<K[]>((a, v) => [...a, mapFunc(v)], []);
}

[dannnnydannnn]

I was going crazy trying to figure out what the issue was with the myFilter function. I carefully followed along and double and triple checked to make sure I didn't have a typo. Eventually you ran into the same issue for the myMap function. If anyone else is having this issue for myFilter, add "as T[ ]" at the end of the return statement as he did with myMap.

[facelessGuidance]

As a Pokemon fan I need to point, that You probably was thinking about Venusaur (instead of Megasaur), nonetheless tutorial is awesome. I'm working with typescript for about 4 years now, but decided to "return to roots" to understand it better. I couldn't get better teacher than You :) thanks a lot :)

[РоманТищук-ев]

A good thing about TypeScript that it makes you understand vanillaJS even better, especially with such exercises. Thanks for good content))

[jackh]

Another helpful video! And I appreciate not being interrupted by ads. The algorithm doesn't seem to mind.

[tanercoder]

'you are IN or you are OUT', said in Arnolds voice made my day. such things just brighten me up...

[SamAbaasi]

Amazing series with awesome teacher...Thanks so much

[rembautimes]

Great series - watching it half way across the globe 🌍

[Pedro-yohr]

I'm finding this a bit too daunting to even begin... but I'm not ready to hit play just yet. So I guess the trick here will be to make reduce disregard the acumulator and the current value, so that it just executes the callback on each array element, without any kind of "interference" from what happened before. Is this the right foundation to start thinking about it? Or am I missing something?

[kettenbach]

Your content is centrally not generic. ☝️😀 And yes Wrath of Ricardo Montalbán was by far the greatest. I still get creeped out by the bugs in the ears. 😀

[rokinos]

straight to the point thank you for the No bs ts SERIE

[victorlongon]

really good stuff, Jack! I have been using js for year but I am pretty knew to ts, so this videos are really hoping me wrap my head around it. Keep it up! ❤️
I am looking forward for the next video. I have used utils like pick, omit, etc but sometimes I feel like going to a corner and crying and working with more complex stuff in ts in react with redux etc :)

[romanshestakov]

Hi, thanks for the video, what about arrow functions for the example? I get an `Cannot find name 'T'.(2304)` error while trying to set the initial reduce value to [] as T[]

[lttaylor]

Hello, I have a couple of questions about line 11. First, are you using the "?" to check for the existence of the "filterFunc" function or are you checking whether or not it is executed?

[jorgeiglopez]

Super useful!! Thanks, great content!!

[aaronalquiza]

i love the random pop culture references. lol

[ponderatulify]

So the type declaration for a function can only be made inline ?

[mumps]

Ugh! Fun exercise but with myForEach I'm really struggling to understand the relationship at work here between the voids and the undefineds. So...my brain tells me that it makes sense to have the initial value to reduce() be undefined, because we must provide *some* initial value unless we want the first element of our array to be skipped, and nothing else would be appropriate since we really don't care about the accumulator. Once I accept that, then it also makes sense to me that the callback passed to reduce() must keep returning undefined, since what we return becomes the next iteration's "previous" value. But...assuming this reasoning is okay, I still don't see why we can't just say "return forEachFunc(v)" since if forEachFunc() doesn't return anything, wouldn't it also be undefined? Also still not sure why we need to say that our function's callback and the function itself have a return type of void. 🤔

[lttaylor]

Secondly, still on line 11, could you explain in a bit more detail the options for what is returned in the case of true or false when you write [...a, v] : a [ ]. I'm struggling to understand the syntax. Is this an implementation of optionals in TS? Thirdly, are you using the " ..." as a spread or rest operator in this case? thanks. Love your tutorials. Should I send questions to your email or to comments?

[yaserghananwi]

Really very nice video how can use generic type in these functions