TypeScript is a statically typed language that provides several utility types to help developers write more expressive and maintainable code. In this article, we'll explore the different utility types available in TypeScript and provide guidance on how to choose the right one for your use case.
What are Utility Types?
Utility types are a set of generic types that can be used to manipulate and transform other types. They are called "utility" types because they provide a way to perform common type transformations and manipulations in a reusable and composable way.
1. Partial Type
The `Partial` type is used to create a new type that represents a subset of the properties of an existing type. It is often used to create a type that represents a partial or incomplete version of an object.
interface User {
name: string;
age: number;
}
type PartialUser = Partial<User>;
const user: PartialUser = {
name: 'John Doe',
};
2. Readonly Type
The `Readonly` type is used to create a new type that represents a read-only version of an existing type. It is often used to create a type that represents a constant or immutable object.
interface User {
name: string;
age: number;
}
type ReadonlyUser = Readonly<User>;
const user: ReadonlyUser = {
name: 'John Doe',
age: 30,
};
// Error: Cannot assign to 'name' because it is a read-only property.
user.name = 'Jane Doe';
3. Record Type
The `Record` type is used to create a new type that represents an object with a specific set of properties. It is often used to create a type that represents a dictionary or a map.
type StringNumberMap = Record<string, number>;
const map: StringNumberMap = {
'one': 1,
'two': 2,
};
4. Pick Type
The `Pick` type is used to create a new type that represents a subset of the properties of an existing type. It is often used to create a type that represents a selection of properties from an object.
interface User {
name: string;
age: number;
}
type UserName = Pick<User, 'name'>;
const user: UserName = {
name: 'John Doe',
};
5. Omit Type
The `Omit` type is used to create a new type that represents a subset of the properties of an existing type, excluding a specific set of properties. It is often used to create a type that represents an object with a specific set of properties removed.
interface User {
name: string;
age: number;
}
type UserWithoutAge = Omit<User, 'age'>;
const user: UserWithoutAge = {
name: 'John Doe',
};
6. Exclude Type
The `Exclude` type is used to create a new type that represents the exclusion of a specific type from a union type. It is often used to create a type that represents a union of types, excluding a specific type.
type StringOrNumber = string | number;
type ExcludeString = Exclude<StringOrNumber, string>;
const value: ExcludeString = 42;
7. Extract Type
The `Extract` type is used to create a new type that represents the extraction of a specific type from a union type. It is often used to create a type that represents a union of types, extracting a specific type.
type StringOrNumber = string | number;
type ExtractString = Extract<StringOrNumber, string>;
const value: ExtractString = 'hello';
8. NonNullable Type
The `NonNullable` type is used to create a new type that represents the non-nullable version of a type. It is often used to create a type that represents a value that cannot be null or undefined.
type NullableString = string | null | undefined;
type NonNullableString = NonNullable<NullableString>;
const value: NonNullableString = 'hello';
9. Parameters Type
The `Parameters` type is used to create a new type that represents the parameters of a function type. It is often used to create a type that represents the arguments of a function.
type AddFunction = (a: number, b: number) => number;
type AddFunctionParameters = Parameters<AddFunction>;
const parameters: AddFunctionParameters = [1, 2];
10. ReturnType Type
The `ReturnType` type is used to create a new type that represents the return type of a function type. It is often used to create a type that represents the result of a function.
type AddFunction = (a: number, b: number) => number;
type AddFunctionReturnType = ReturnType<AddFunction>;
const result: AddFunctionReturnType = 3;
11. InstanceType Type
The `InstanceType` type is used to create a new type that represents the instance type of a constructor type. It is often used to create a type that represents the instance of a class.
class User {
constructor(public name: string) {}
}
type UserInstance = InstanceType<typeof User>;
const user: UserInstance = new User('John Doe');
12. ThisParameterType Type
The `ThisParameterType` type is used to create a new type that represents the type of the `this` parameter of a function type. It is often used to create a type that represents the context of a function.
type AddFunction = (this: void, a: number, b: number) => number;
type AddFunctionThisParameter = ThisParameterType<AddFunction>;
const thisParameter: AddFunctionThisParameter = undefined;
13. OmitThisParameter Type
The `OmitThisParameter` type is used to create a new type that represents the type of a function without the `this` parameter. It is often used to create a type that represents a function without the context.
type AddFunction = (this: void, a: number, b: number) => number;
type AddFunctionWithoutThisParameter = OmitThisParameter<AddFunction>;
const functionWithoutThisParameter: AddFunctionWithoutThisParameter = (a, b) => a + b;
14. ThisType Type
The `ThisType` type is used to create a new type that represents the type of the `this` parameter of a function type. It is often used to create a type that represents the context of a function.
type AddFunction = (this: void, a: number, b: number) => number;
type AddFunctionThisType = ThisType<AddFunction>;
const thisType: AddFunctionThisType = undefined;
Conclusion
In conclusion, TypeScript provides a wide range of utility types that can be used to manipulate and transform other types. By understanding the different utility types available, developers can write more expressive and maintainable code. In this article, we explored the different utility types available in TypeScript and provided examples of how to use them.
Frequently Asked Questions
Q: What is the difference between the `Partial` and `Readonly` types?
A: The `Partial` type creates a new type that represents a subset of the properties of an existing type, while the `Readonly` type creates a new type that represents a read-only version of an existing type.
Q: How do I use the `Record` type to create a dictionary?
A: You can use the `Record` type to create a dictionary by specifying the key type and the value type. For example, `type StringNumberMap = Record<string, number>;` creates a dictionary with string keys and number values.
Q: What is the difference between the `Pick` and `Omit` types?
A: The `Pick` type creates a new type that represents a subset of the properties of an existing type, while the `Omit` type creates a new type that represents a subset of the properties of an existing type, excluding a specific set of properties.
Q: How do I use the `Exclude` type to exclude a specific type from a union type?
A: You can use the `Exclude` type to exclude a specific type from a union type by specifying the type to exclude. For example, `type ExcludeString = Exclude<StringOrNumber, string>;` excludes the `string` type from the `StringOrNumber` union type.
Q: What is the difference between the `NonNullable` and `Nullable` types?
A: The `NonNullable` type creates a new type that represents the non-nullable version of a type, while the `Nullable` type creates a new type that represents the nullable version of a type.
Q: How do I use the `Parameters` type to create a type that represents the parameters of a function?
A: You can use the `Parameters` type to create a type that represents the parameters of a function by specifying the function type. For example, `type AddFunctionParameters = Parameters<AddFunction>;` creates a type that represents the parameters of the `AddFunction` function.
Comments
Post a Comment