Hasty Treat - TypeScripts Strict Explained

Published: Sept. 6, 2021, 1 p.m.

In this Hasty Treat, Scott and Wes talk about the Typescript\xa0strict\xa0flag \u2014 what it does and why you might use it.

Sanity - Sponsor

Sanity.io\xa0is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at\xa0sanity.io/create. Get an awesome supercharged free developer plan on\xa0sanity.io/syntax.

LogRocket - Sponsor

LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It\u2019s an exception tracker, a session re-player and a performance monitor. Get 14 days free at\xa0logrocket.com/syntax.

Show Notes

02:50 - What is it?

  • Future versions of TypeScript may introduce additional stricter checking under this flag, so upgrades of TypeScript might result in new type errors in your program. When appropriate and possible, a corresponding flag will be added to disable that behavior.

03:26 -\xa0noImplicitAny

  • The\xa0any\xa0type in TypeScript is exactly that - it can be anything.
  • TypeScript will try to\xa0infer\xa0the type. When it can\u2019t it will be\xa0any.
  • Sometimes you need\xa0any, but if that is the case, you must explicitly type it as\xa0any.
  • If something is implicitly\xa0any\xa0- it might be a mistake, or you forgot to type it. Risky!

06:01 -\xa0noImplicitThis

  • You must type\xa0this\xa0- it can\u2019t be implicitly inferred.

06:47 -\xa0strictFunctionTypes

  • If you have a type that is a function and it doesn\u2019t 100%.

07:44 -\xa0alwaysStrict

  • Always turns on strict mode. You can\u2019t do things like redeclare\xa0var\xa0variables.

09:25 -\xa0strictNullChecks

  • Makes you check that the item is actually there before accessing a value or method from it.
  • Imagine you filter or find on an array, or query selector a DOM element. There is a possibility that nothing is there.\xa0strictNullChecks\xa0makes you check that it\u2019s there - like an if statement.
  • Optional chaining is super handy here.

11:18 -\xa0strictBindCallApply

12:38 -\xa0strictPropertyInitialization

13:37 -\xa0useUnknownInCatchVariables

Links Tweet us your tasty treats!