What are the best practices for using optional chaining in TypeScript?

What are the best practices for using optional chaining in TypeScript?

Optional chaining is a powerful feature in TypeScript that allows you to safely access deeply nested properties. Here are some best practices:

1. Use it to avoid runtime errors when accessing properties of potentially null or undefined objects.
2. Combine it with nullish coalescing to provide default values.
3. Avoid overusing it in performance-critical code, as it can introduce overhead.

Can you give me an example of how to use optional chaining?

Sure! Here's a simple example:

const user = { name: 'Alice', address: { city: 'Wonderland' } };
const city = user.address?.city ?? 'Unknown';
console.log(city); // Outputs: Wonderland

In this example, if address is undefined, city will default to 'Unknown'.

Are there any limitations to optional chaining?

Yes, there are a few limitations:

1. It cannot be used with non-object types like numbers or strings.
2. It doesn't work with certain TypeScript features like type assertions.
3. Overusing it can lead to less readable code, so use it judiciously.

How does optional chaining compare to traditional checks?

Optional chaining simplifies the syntax significantly. Instead of writing multiple checks like:

if (user && user.address && user.address.city) {
  console.log(user.address.city);
}

You can simply write:

console.log(user.address?.city);

This makes your code cleaner and easier to read.