Quartz 🪬

TypeScript - Utility Types

3 min read

Pick<Type, Keys>

Xây dựng một type bằng cách chọn các thuộc tính Keys từ Type.

Ví dụ:

interface Todo {
  title: string
  description: string
  completed: boolean
}
 
type TodoPreview = Pick<Todo, "title" | "completed">
 
const todo: TodoPreview = {
  title: "Clean room",
  completed: false,
}
 
console.log(todo)
// Output: { title: 'Clean room', completed: false }

Omit<Type, Keys>

Xây dựng một type bằng cách lấy tất cả các thuộc tính từ Type ngoại trừ các thuộc tính Keys. Là trái ngược của Pick<Type, Keys>.

Ví dụ:

interface Todo {
  title: string
  description: string
  completed: boolean
  createdAt: number
}
 
type TodoInfo = Omit<Todo, "completed" | "createdAt">
 
const todoInfo: TodoInfo = {
  title: "Pick up kids",
  description: "Kindergarten closes at 5pm",
}
 
console.log(todoInfo)
// Output: { title: 'Pick up kids', description: 'Kindergarten closes at 5pm' }

Partial<Type>

Xây dựng một type mà có thể có hoặc không các thuộc tính của Type.

Ví dụ:

interface Todo {
  title: string
  description: string
}
 
function updateTodo(todo: Todo, fieldsToUpdate: Partial<Todo>) {
  return { ...todo, ...fieldsToUpdate }
}
 
const todo1 = {
  title: "organize desk",
  description: "clear clutter",
}
 
const todo2 = updateTodo(todo1, {
  description: "throw out trash",
})
 
console.log(updateTodo(todo1, { ...todo2 }))
// Output: { title: 'organize desk', description: 'throw out trash' }

Required<Type>

Tạo ra một type mà bắt buộc phải có tất cả các thuộc tính của Type. Là trái ngược của [[#partial-type-|Partial ]].

Ví dụ:

interface Props {
  a?: number
  b?: string
}
 
const obj: Props = { a: 5 }
 
const obj2: Required<Props> = { a: 5 } // ❌ Error: Property 'b' is missing in type '{ a: number; }' but required in type 'Required<Props>'.

Toán tử ? là để đánh dấu một field nào đó trong object có thể không có.

Record<Keys, Type>

Xây dựng một object với danh sách các key là Keys và giá trị của các key có kiểu là Type.

Ví dụ:

type CatName = "miffy" | "boris" | "mordred" // Keys
 
interface CatInfo {
  age: number
  breed: string
} // Type of value
 
const cats: Record<CatName, CatInfo> = {
  miffy: { age: 10, breed: "Persian" },
  boris: { age: 5, breed: "Maine Coon" },
  mordred: { age: 16, breed: "British Shorthair" },
}
 
console.log(cats.boris)
// Output: { age: 5, breed: 'Maine Coon' }

Parameters<Type>1

Xây dựng một tuple type dựa trên các tham số của hàm có kiểu là Type.

Ví dụ:

function createUser(username: string, password: string) {
  return { username, password }
}
 
type CreateUserInput = Parameters<typeof createUser>
 
const data: CreateUserInput = ["kwan", "112"]
 
console.log(data)
// Output: [ 'kwan', '112' ]

Cụ thể, kiểu dữ liệu của CreateUserInput là [username: string, password: string].

ReturnType<Type>2

Xây dựng một type dựa trên giá trị trả về của hàm có kiểu là Type.

Ví dụ:

function createUser(username: string, password: string) {
  return { username, password }
}
 
type CreateUserResult = ReturnType<typeof createUser>
 
const result: CreateUserResult = { username: "kwan", password: "112" }
 
console.log(result)
// Output: { username: 'kwan', password: '112' }

Resources

Footnotes

  1. Tham khảo TypeScript: Documentation - Utility Types - Parameters để biết thêm các usecase khác. ↩

  2. Tham khảo TypeScript: Documentation - Utility Types - Return Type để biết thêm các usecase khác. ↩

Backlinks