View profile

All Things Typescript Newsletter - Issue #13 - Type Inference in Typescript

Maina Wycliffe
Maina Wycliffe
Good morning; I hope you had a great weekend. In this week’s newsletter, we will talk about Type Inference in Typescript. This week I am celebrating reaching 600 followers on Twitter, and I am hoping to get more followers in the future and subscribers to the newsletter. Please share this newsletter with your friends and colleagues and help me grow the list of subscribers. Thank you.

Type Inference in Typescript
Type inference is the automatic detection of types without explicitly defining the types. Typescript will attempt to detect types whenever possible automatically and will fall back to any whenever it can’t.
Take the following examples:
let x = 1; // type is infered as number
let y = "Hello World"; // type is infered as string
From the above examples, typescript will correctly infer the types of x and y without us having to define types explicitly. If we wanted, we could define the types explicitly for the above, as shown below:
let x : number = 1;
let y: string = "Hello World";
As you can imagine, using type inference takes the burden from us of having to state the type for each element explicitly. This can work with functions as well:
Type Inference for Functions
Type Inference for Functions
As you can see from above, Typescript will infer the type of doSomething function as boolean. There are a few limitations to Type inference:
  • Function Parameters are not inferred, and Typescript will attach any if the type is not explicitly defined.
  • And external data can not be inferred because Typescript doesn’t have enough information about it.
Best Practices
  • Always explicitly define the return types of a function. Types are a declaration of intention, a contract of the shape of data a function results to, and this should be explicitly defined. This will allow Typescript to type your intention and the resulting function return data, giving you more type safety.
  • Always define the types for function parameters; this is because Typescript will implicitly type that as any if no type is not assigned and any means any type is acceptable, removing type safety.
  • Explicitly define Types for external data; otherwise, Typescript will implicitly define it as any. This will compromise type safety as any data shape goes for any type. You can learn more about any here.
  • You can rely on Type inference for simple variable assignments, as this tends to be straightforward to infer the types.
Typescript does provide two configurations to help us when it comes to implicit typings - noImplicitAny and noImplicitThis. With noImplicitAnyThe Typescript compiler will throw an error if an inferred type is any, while noImplicitThis will throw an error if an inferred type for this is imprecise and results in it being any.
Top Articles
Tweets
Michael Hoffmann
💡 JavaScript Tip:

Use numeric separators to make large numbers more readable. https://t.co/j4LNDgVGat
Decoded Frontend (Dmytro Mezhenskyi) 🇺🇦
Frontend Snack #10💡#Angular14 comes with many new and cool features and here is one of those.

Like it? Share it! 🙏🏻 💁🏼‍♂️ If you’re interested in advanced videos about #Angular? Check out my channel - https://t.co/EYZveJWGWX

#AngularTip #TypeScript #frontenddev https://t.co/uyvH6DUNgU
Florian Spier
#TypeScript surprises:

You can spread whatever object into another object and TS will not complain.

Example: spread an Address object into a Product object, but the Product interface does not have the Address props.

Play with it on @stackblitz: https://t.co/6ekUmWh2XW https://t.co/6AKxunsDdW
Maina Wycliffe
1 benefit of having 1 component per file is you can standardize the naming of some types such as Props. Since there are no other components in the file, a type Props is clear what its purpose is, without the need to make the name more descriptive.
#typescript #JavaScript #webdev https://t.co/ncWjNHLl2k
Hugo
#typescript: Readonly<Type>

💡 Useful when you don't want to allow changes on a specific interface like when working with javascript frozen objects

It will construct a type with all the properties of Type set to readonly.

#javascript #webdevelopment #webdev #vuejs #100Devs https://t.co/M22dIDCBlO
Did you enjoy this issue? Yes No
Maina Wycliffe
Maina Wycliffe @mwycliffe_dev

Hand-picked typescript and related content on a weekly basis to help you improve your skills and knowledge.

In order to unsubscribe, click here.
If you were forwarded this newsletter and you like it, you can subscribe here.
Created with Revue by Twitter.