A brief discussion on 7 methods worth knowing in TypeScript

This article will share with you 7 methods in TypeScript that you need to know. I hope it will be helpful to you!

#The type system in TypeScript is very powerful. It provides us with type safety. As beloved as type systems are, they can also make our code cluttered and unreadable if we don't plan and design types and interfaces.

Generics

Avoiding code duplication and creating reusable types is an important part of writing concise code. Generics are a feature of TypeScript that allow us to write reusable types. Look at the following example:

type Add = (a: T, b: T) => T const addNumbers: Add = (a, b) => { return a + b } const addStrings: Add = (a, b) => { return a + b }

Put the correct type into the generic type ofAdd, which can be used to describe the addition of two numbers or the concatenation of two strings. Instead of writing a type for each function, we only need to do it once with generics. Not only does this save us effort, but it also makes our code cleaner and less error-prone.

Utility types

TypeScript natively provides several useful utility types to help us perform some common type conversions. These utility types are globally available and they all use generics.

The following 7 are the ones I often use.

1.Pick

Pickwill select the attribute set Keys from Type to create a New type, Keys can be a string literal or a union of string literals. The value of Keys must be a key of the Type , otherwise the TypeScript compiler will complain. This utility type is particularly useful when you want to create a lighter object by picking certain properties from an object that has many properties.

type User = { name: string age: number address: string occupation: string } type BasicUser = Pick // type BasicUser = { // name: string; // age: number; // }

2.Omit

Omitis the opposite ofPick.KeysIt does not mean which attributes to keep, but the set of attribute keys to omit. This is more useful when we just want to remove certain properties from the object and keep others.

type User = { name: string age: number address: string occupation: string } type BasicUser = Omit // type BasicUser = { // name: string; // age: number; // }

3.Partial

PartialConstructs a type with all its type attributes set is optional. This can be very useful when we are writing update logic for an object.

type User = { name: string age: number address: string occupation: string } type PartialUser = Partial // type PartialUser = { // name?: string; // age?: number; // address?: string; // occupation?: string; // }

4.Required

##Requiredis the opposite ofPartial. It constructs a type where all properties are required. It can be used to ensure that no optional properties are present in a type.

type PartialUser = { name: string age: number address?: string occupation?: string } type User = Required // type User = { // name: string; // age: number; // address: string; // occupation: string; // }

5.Readonly

ReadonlyConstructs a type with all properties of its type set is read-only. Reassigning a new value TS will result in an error.

type User = { name: string age: number address: string occupation: string } type ReadOnlyUser = Readonly const user: ReadOnlyUser = { name: "小智", age: 24, address: "厦门", occupation: "大迁世界" } user.name = "王大冶" // Cannot assign to 'name' because it is a read-only property.

6.ReturnType

ReturnTypeConstructs a type from the return type of a function type. It is very useful when we deal with function types from external libraries and want to build custom types based on them.

import axios from 'axios' type Response = ReturnType function callAPI(): Response{ return axios("url") }

https://www.typescriptlang.org/docs/handbook/utility-types.html

This article is reprinted at: https://segmentfault.com/a/1190000040574488

Introduction to Programming! !

The above is the detailed content of A brief discussion on 7 methods worth knowing in TypeScript. For more information, please follow other related articles on the PHP Chinese website!