Optional and Readonly Properties
TypeScript interfaces allow you to control how objects are structured, but sometimes you need more flexibility or safety. Two useful features for this are optional properties and readonly properties. Optional properties are declared using a question mark (?) after the property name, indicating that the property may or may not be present on objects that implement the interface. Readonly properties use the readonly keyword to ensure that, once set, their value cannot be changed.
12345678910111213141516interface Product { readonly id: number; name: string; description?: string; } const book: Product = { id: 101, name: "TypeScript Handbook" }; const pen: Product = { id: 102, name: "Blue Pen", description: "A smooth-writing blue pen" };
In this example, the Product interface has a readonly id property, a required name property, and an optional description property. When you create a Product object, you must provide an id and name, but description is not required. If you try to assign a new value to id after the object is created, TypeScript will give you an error because id is marked as readonly. On the other hand, you can omit description entirely, or include it if you like. This makes your code safer—preventing accidental changes to properties that should never change—and more flexible, allowing objects to omit properties that are not always needed.
Kiitos palautteestasi!
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
Awesome!
Completion rate improved to 9.09Optional and Readonly Properties
Pyyhkäise näyttääksesi valikon
TypeScript interfaces allow you to control how objects are structured, but sometimes you need more flexibility or safety. Two useful features for this are optional properties and readonly properties. Optional properties are declared using a question mark (?) after the property name, indicating that the property may or may not be present on objects that implement the interface. Readonly properties use the readonly keyword to ensure that, once set, their value cannot be changed.
12345678910111213141516interface Product { readonly id: number; name: string; description?: string; } const book: Product = { id: 101, name: "TypeScript Handbook" }; const pen: Product = { id: 102, name: "Blue Pen", description: "A smooth-writing blue pen" };
In this example, the Product interface has a readonly id property, a required name property, and an optional description property. When you create a Product object, you must provide an id and name, but description is not required. If you try to assign a new value to id after the object is created, TypeScript will give you an error because id is marked as readonly. On the other hand, you can omit description entirely, or include it if you like. This makes your code safer—preventing accidental changes to properties that should never change—and more flexible, allowing objects to omit properties that are not always needed.
Kiitos palautteestasi!
