✅ What is Partial<T> in TypeScript?
Partial<T> is one of TypeScript’s utility types that makes all properties in a given type optional.
type Partial<T> = {
[P in keyof T]?: T[P];
};
- keyof T → Retrieves all property keys of T.
- [P in keyof T] → Iterates over all properties of T.
- ?: → Makes each property optional (?).
- T[P] → Keeps the original type of each property.
📌 1. Basic Example of Partial<T>
type Todo = {
title: string;
description: string;
completed: boolean;
};
// Applying `Partial<Todo>` makes all properties optional
type PartialTodo = Partial<Todo>;
/*
PartialTodo type will be:
type PartialTodo = {
title?: string;
description?: string;
completed?: boolean;
}
*/
- PartialTodo is a new type where all properties become optional.
- This means we can define an object with only some of the properties.
✅ Example Usage
const update: Partial<Todo> = {
title: "Learn TypeScript",
}; // ✅ Only `title` is provided, and it's valid
📌 2. Updating Objects with Partial<T>
Using Partial<T>, we can create a function that updates only specific properties of an object.
function updateTodo(todo: Todo, updates: Partial<Todo>): Todo {
return { ...todo, ...updates };
}
// Original object
const myTodo: Todo = {
title: "Learn TypeScript",
description: "Study utility types",
completed: false,
};
// Update only the `completed` property
const updatedTodo = updateTodo(myTodo, { completed: true });
console.log(updatedTodo);
/*
Output:
{
title: "Learn TypeScript",
description: "Study utility types",
completed: true
}
*/
✅ Here, updates can contain only some properties, making it more flexible.
📌 3. Partial<T> vs Required<T>
- Partial<T> → Makes all properties optional (?).
- Required<T> → Makes all properties mandatory.
type RequiredTodo = Required<Partial<Todo>>;
/*
RequiredTodo type will be:
type RequiredTodo = {
title: string;
description: string;
completed: boolean;
}
*/
- Required<T> removes the optional modifier (?), ensuring all properties must be provided.
📌 4. Practical Uses of Partial<T>
✅ 1) Partial Updates in API Requests (PATCH)
Partial<T> is useful in REST APIs where partial updates (e.g., PATCH requests) are needed.
function updateUser(userId: number, updates: Partial<User>) {
// Simulating a PATCH request to the server
console.log(`Updating user ${userId} with:`, updates);
}
updateUser(1, { name: "Alice" }); // ✅ Only updating the `name`
updateUser(2, { email: "new@email.com", age: 30 }); // ✅ Updating multiple fields
✅ 2) Merging Objects with Default Settings
Partial<T> allows us to modify only specific properties while keeping the existing values.
const defaultSettings = {
theme: "light",
notifications: true,
autoSave: false,
};
const userSettings: Partial<typeof defaultSettings> = {
theme: "dark",
};
const finalSettings = { ...defaultSettings, ...userSettings };
console.log(finalSettings);
/*
Output:
{
theme: "dark",
notifications: true,
autoSave: false
}
*/
✅ userSettings is Partial, so it allows updating only specific properties.
🚀 Summary
Utility Type Description Use Case
Partial<T> | Makes all properties optional | Allows partial updates |
Required<T> | Makes all properties mandatory | Forces all properties to be present |
📌 Partial<T> is one of the most commonly used utility types in TypeScript because it makes object updates more flexible and safer! 🚀
'javascript & typescript' 카테고리의 다른 글
콜백함수, 프로미스, async/await 차이점과 예제 정리 (자바스크립트 비동기 처리) (0) | 2025.04.12 |
---|---|
JavaScript 배열 함수 모음 (0) | 2025.04.12 |
Single Field Updates vs. TypeScript Partial<T> (0) | 2025.02.15 |
Index Type (0) | 2025.02.14 |
type aliases vs interfaces (0) | 2025.02.14 |