Rumah > hujung hadapan web > tutorial js > Melepaskan Kuasa Jenis Utiliti dalam TypeScript

Melepaskan Kuasa Jenis Utiliti dalam TypeScript

Patricia Arquette
Lepaskan: 2024-11-11 18:44:03
asal
249 orang telah melayarinya

Unleashing the Power of Utility Types in TypeScript

Hai, pahlawan TypeScript! ? Jadi, anda setinggi lutut dalam TypeScript, dan mungkin anda tertanya-tanya, "Mengapa terdapat begitu banyak kod hanya untuk mengurus jenis?" Jangan risau—anda tidak bersendirian. Kita semua dalam perjalanan liar yang ditaip secara statik ini bersama-sama.

Hari ini, kami menyelami beberapa alatan TypeScript yang paling hebat, Jenis Utiliti. Ini seperti kod menipu kecil dalam permainan video yang membantu anda mempercepatkan dan memudahkan kod anda. Jadi, mari kita menyingsing lengan baju kita dan ikuti lawatan yang menyeronokkan tentang jenis utiliti yang paling berguna dalam TypeScript—dan cara ia boleh menjadikan kod anda kurang menyusahkan.

Whataat? Lebih banyak jenis.

Bayangkan anda cuba menggunakan jenis TypeScript tanpa menulis segala-galanya dari awal (kerana siapa yang mempunyai masa untuk itu?). Jenis utiliti membolehkan anda membuat jenis baharu dengan mengubah atau menggunakan semula bahagian jenis lain. Anggaplah mereka sebagai alat dapur mewah yang boleh dihiris tanpa memerlukan usaha tambahan. Mereka menjimatkan masa, mengurangkan lebihan dan menjadikan kod anda lebih mudah untuk diurus. Mari pecahkan satu persatu!

Separa

Apa Fungsinya: Menjadikan semua sifat dalam jenis sebagai pilihan. Ya, semudah itu.

Mengapa Anda Akan Menyukainya: Sesuai untuk masa-masa apabila anda memerlukan beberapa objek, tetapi bukan semuanya.

type User = {
  id: number;
  name: string;
  email: string;
};

function updateUser(id: number, newValues: Partial<User>) {
  // Update only the properties you need, no need to bring everything.
}

updateUser(1, { name: "Ash" }); // Only updating name, thanks to Partial!

Salin selepas log masuk
Salin selepas log masuk

Diperlukan

Apa Fungsinya: Mewajibkan semua sifat dalam jenis. Cara kecil TypeScript untuk mengatakan, "Jangan melangkau mana-mana medan!"

Mengapa Anda Akan Menyukainya: Kadangkala, pilihan bukan pilihan. Anda memerlukan semuanya dikunci dan dimuatkan, terutamanya jika sifat tertentu adalah pilihan sebelum ini.

type UserWithOptionalFields = {
  id: number;
  name?: string;
  email?: string;
};

const user: Required<UserWithOptionalFields> = {
  id: 1,
  name: "John",
  email: "john@example.com",
}; // All properties are now required!
Salin selepas log masuk
Salin selepas log masuk

Rekod

Apa Fungsinya: Mencipta jenis objek dengan kekunci Kekunci dan nilai Jenis. Anggap ia sebagai ciri "buat kamus anda sendiri" TypeScript.

Mengapa Anda Akan Menyukai Sayat: Jenis ini ialah kawan baik anda apabila anda mahukan cara yang cepat dan mudah untuk memetakan data, terutamanya jika anda mengetahui kuncinya lebih awal.

type Role = "admin" | "user" | "guest";

const rolePermissions: Record<Role, string[]> = {
  admin: ["read", "write", "delete"],
  user: ["read", "write"],
  guest: ["read"],
};
Salin selepas log masuk
Salin selepas log masuk

Pilih

Apa Yang Dilakukans: Mengambil jenis sedia ada dan memilih sifat yang anda tentukan sahaja. Anggap ia sebagai cara TypeScript untuk berkata, "Mari kita kekalkan ini pendek dan manis."

Mengapa Anda Akan Menyukainya: Sesuai untuk mencipta subset jenis sedia ada tanpa menyeret semuanya, dan kerana ia adalah salah satu kegemaran saya.

type User = {
  id: number;
  name: string;
  email: string;
  age: number;
};

type UserPreview = Pick<User, "id" | "name">;
Salin selepas log masuk

Tinggalkan

Apa Fungsinya: Ini bertentangan dengan Pick. Ia membolehkan anda mengecualikan sifat tertentu daripada sesuatu jenis.

Mengapa Anda Akan Menyukainya: Hebat apabila anda mempunyai jenis, tetapi hanya ada satu bidang yang menjengkelkan yang anda tidak mahu.

type User = {
  id: number;
  name: string;
  email: string;
};

function updateUser(id: number, newValues: Partial<User>) {
  // Update only the properties you need, no need to bring everything.
}

updateUser(1, { name: "Ash" }); // Only updating name, thanks to Partial!

Salin selepas log masuk
Salin selepas log masuk

Kecualikan

Apa Fungsinya: Mengalih keluar jenis tertentu daripada kesatuan. Ini ialah "sepak keluar dari sembang kumpulan" TypeScript.

Mengapa Anda Akan Menyukainya: Ia sangat berguna apabila anda mempunyai kesatuan yang besar tetapi hanya perlu mengendalikan beberapa kes.

type UserWithOptionalFields = {
  id: number;
  name?: string;
  email?: string;
};

const user: Required<UserWithOptionalFields> = {
  id: 1,
  name: "John",
  email: "john@example.com",
}; // All properties are now required!
Salin selepas log masuk
Salin selepas log masuk

Ekstrak

Apa Fungsinya: Adik beradik kembar Exclude, Extract hanya menyimpan jenis yang sepadan dengan kesatuan tertentu.

Mengapa Anda Akan Menyukainya: Jenis ini mengecilkan jenis kesatuan kepada bahagian yang berkaitan sahaja.

type Role = "admin" | "user" | "guest";

const rolePermissions: Record<Role, string[]> = {
  admin: ["read", "write", "delete"],
  user: ["read", "write"],
  guest: ["read"],
};
Salin selepas log masuk
Salin selepas log masuk

Dan begitulah! ? Walaupun Extract dan Pick mungkin berbunyi sama, mereka secara unik sesuai untuk pekerjaan yang berbeza: Extract ialah penapis anda untuk jenis kesatuan, manakala Picklets anda memilih sifat ceri daripada jenis objek. Perkara yang sama berlaku untuk rakan sejawat mereka, Kecualikan dan Abaikan.

Jenis utiliti ini kecil tetapi hebat! Mereka menjimatkan masa, mengurangkan lebihan kod dan memastikan keadaan sentiasa kemas. Jadi lain kali anda bergelut dengan jenis, ingat pembantu ini. Mereka akan berada di sana untuk memudahkan perjalanan TypeScript anda dan menjadikannya lebih menyeronokkan. Selamat mengekod, dan semoga jenis anda sentiasa tepat seperti yang anda perlukan! ?

Atas ialah kandungan terperinci Melepaskan Kuasa Jenis Utiliti dalam TypeScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan