DEV Community

15 Advanced TypeScript Tips for Development

Lakshmanan Arumugam on July 14, 2023

1.Optional Chaining (?.): Optional chaining allows you to safely access nested properties or methods without worrying about null or undefined value...

Read full post

Vıɔk A Hıƃnıʇɐ C. • Jul 15 '23

Hey bro, great post!!
A small observation. For point 8 you can use the Partial Type like this:

interface User {
  id: number;
  name: string;
  email: string;
}

type PartialUser = Partial<User>;

const partialUser: PartialUser = {
  name: "Nikola Tesla",
  email: "nikola@teslaxcorp.com"
};

Even, add new properties, for example:

type MyOwnUser = Partial<User> & { age: number };

const ownUser: MyOwnUser = {
  name: "Nikola Tesla",
  email: "nikola@teslaxcorp.com",
  age: 27
};

Devstories Playground • Aug 3 '23

Samuel Braun • Jul 16 '23 • Edited

Another one I enjoy quiet often is the const assertion. With them you can make stuff readonly outside of class members. For example:

With as const:

// Type '"hello"'
let x = "hello" as const;

// Type 'readonly [10, 20]'
let y = [10, 20] as const;

// Type '{ readonly text: "hello" }'
let z = { text: "hello" } as const;

Without as const:

// Type 'string'
let x = "hello";

// Type 'number[]'
let y = [10, 20];

// Type '{ text: string }'
let z = { text: "hello" };

Jimmy • Jul 16 '23

Hey 👋 Nice post 😉

An improvement for point 3 :

let userInput: unknown
userInput = "Hello World"
const strLength = (userInput as string).length;
console.log(strLength); // Output: 11

Most of the time, when we create something with unknown it's because you don't know how to provide. In your case, you specify a string value that could be confusing for some beginner developers.

What do you think ? 🙂

AlgoT • Jul 24 '23

You should avoid type assertion as much as possible. You're basically telling typescript to ignore itself and listen to you instead.

Instead of type assertion, use typeguards. You can even make a function to narrow down the type:

export function isString(param: unknown): param is string {
  return typeof param === 'string';
}

const userInput: unknown = 'Hello World';

if (isString(userInput)) {
  console.log(userInput); 
}

duck • Jul 18 '23

in the optional chaining
const invalidCode = user.address?.postalCode?.toLowerCase(); console.log(invalidCode); // Output: undefined
not log undefined

fruntend • Jul 17 '23

Сongratulations 🥳! Your article hit the top posts for the week - dev.to/fruntend/top-10-posts-for-f...
Keep it up 👍

Rense Bakker • Aug 1 '23

Nice list 👍 One thing I would add to the type guards example is the is operator: typescriptlang.org/docs/handbook/a...

David Yao • Jul 24 '23

It's true no matter how experienced you are, you indeed need some good tools to make you shine. Thanks for writing such a great article.

Curtis Maloney • Jul 17 '23

A useful list, and very well presented -- even if the first two are native Javascript features, not specific to TS :)

FRicardi • Jul 16 '23

Great post! I've never looked a lot into decorators until now, would've never thought they were so straightforward to implement

Abhishek Saini • Jul 19 '23

Hi bro, great post!

Mário Santos • Jul 20 '23

Congratulations. It’s a great post and I believe it will help a lot of beginners!

iCrack • Jun 15 • Edited

Great tips! Understanding advanced TypeScript concepts can really improve code quality and maintainability. In a similar way, having clear and organized information—like a Checkers Menu with Prices—helps users quickly find what they need and make informed decisions. Thanks for sharing these practical insights.

twigs Ae • Mar 23 '25

We’ll explore the world of organic whole spices, why they’re worth your investment, how to use them effectively, and how purchasing from 5Senses ensures that you are getting the best spices for your cooking.