An Interest In:
Web News this Week
- April 27, 2024
- April 26, 2024
- April 25, 2024
- April 24, 2024
- April 23, 2024
- April 22, 2024
- April 21, 2024
How the TypeScript Readonly Type Works
TypeScript has a number of utility types, which are types specifically created by TypeScript to solve a problem. In this article, let's look at the Readonly type.
TypeScript Readonly Type
As the name suggests, the Readonly
type in TypeScript suggests that a particular type is read-only.
Let's look at an example. Below, we don't want anyone to update any part of myObject. We can make it a read-only object like so:
type User = { firstName: string, lastName: string}let firstUser:Readonly<User> = { firstName: "John", lastName: "Doe"}
If you try to change a property of firstUser, you'll get the following error:
Cannot assign to 'firstName' because it is a read-only property.
Readonly variables don't work in TypeScript
When we define the type User above, we are creating a custom interface - i.e. something which objects have to conform to. Readonly only works with interfaces or custom types like the one we've used. As such, we can still edit Readonly variables:
let myVariable:Readonly<string> = "Hello World";myVariable = "Goodbye World";console.log(myVariable); // console logs "Goodbye World"
The above code is valid and will work in TypeScript. If you need read only variables, you can simply use const instead, i.e:
const myVariable:string = "Hello World";// Throws error: Cannot assign to 'myVariable' because it is a constant.myVariable = "Goodbye World";
Original Link: https://dev.to/smpnjn/how-the-typescript-readonly-type-works-2on2
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To