TypeScript LOVES errors

Become a TypeScript Wizard with my free beginners TypeScript Course:

Follow Matt on Twitter

Join the Discord:

[niels.faurskov]

This is one of the small conveniences I absolutely love about TypeScript. I've been getting into Swift lately, and Apple has created these guard statements, that albeit very cool; I absolutely hate that I have to forcibly tell the compiler that the variable is indeed not null despite having just created a guard statement for that exact purpose...

[jackdavenport]

I love typescript narrowing, it makes the code so much cleaner while still providing null safety in most situations

[ColinRichardson]

This is why I wrap this function so it's either `getElementOrThrow(selector)` I also have an optional constructor for it to instanceof against so I know if it's an HTMLInputElement or (whatever) or not.

[barneylaurance]

Or if we have the never-returning `raise` function from a previous video we can do `const appElement = ?? raise('cannot find app element');` That will also narrow the type down to just HtmlElement.

[thatguy]

`== null` or `!= null` generally to prevent false-positives on falsy values `0` `""`, etc

[wlockuz]

function invariant<T>(
data: T,
message: string
): asserts data is NonNullable<T> {
if (!data) {
throw new Error(message)
}
}

[BenRangel]

This is a scenario where if we’re sure the element should exist I’d actually prefer just to not handle it and if something breaks rely on default error logging

Cause a) the default error is sometimes better than your custom error msg
b) there might be 100 lines of code like this, selecting elements and I think the intent is more obvious if only a few of them have explicit code that expects the element might not exist - to differentiate from cases where we assume the element should always exist and anythin else is highly unexpected

[ramsey]

I think it comes with the stack tracing where the same thing happens when you use a return statement in a function or a continue/break statement in a loop

[zimcoder]

Feels like a variation of a guard clause

[iMakeYoutubeConfused]

I'm traumatized by the amount of type errors I get every time I use typescript

[tomf]

I use this with react router with useParams if some url params are required.

[carlweis]

Love your videos! Any tips on how to shoot these vertical videos for YouTube shorts? I’m working on some training courses and would love to do something similar. Thank you!!

[Haroun.Benmahdjoub]

Isn't this possible in plain JS? So if I bother to think of writing these lines wouldn't be better to check the existence of this element? Or it is required in some sort of situation in which some element has to be generated in the future?

[DemanaJaire]

You are my favourite TS content creator, but I wish you kept making videos about the English language on your other channel.

[antonpieper]

Or hit hit him with the non-null assertion (though the error is just a generic "cannot read property append on null" or something like that)

[manuelsanchezweb]

Wait, so we are gaining in typing with TS while we can also let the whole app crash? Is there not any other way? By the way, look forward to meeting you in Berlin soon!!!

[souzaramon]

It will be a lot cleanner when throw expressions became a thing

[sobanya_]

putting an exclamation mark pretty much does the same

[traviswatson]

So to prevent the app from crashing, we crash the app?

[ikechukwucharles]

Amazing video.

But how are you using 'new HTMLDivElement' constructor 🤔.

My browser just throws an illegal constructor errror