Jenis Utiliti Typescript Anda Harus Menguasai

Partial Buat semua atribut pilihan dan sesuai untuk operasi kemas kini; 2. Diperlukan Buat semua atribut yang diperlukan untuk memastikan konfigurasi lengkap; 3. ReadOnly Buat jenis baca sahaja untuk mengelakkan pengubahsuaian tidak sengaja; 4. Pilih ekstrak atribut yang ditentukan untuk objek tanaman; 5. Menghilangkan tidak termasuk atribut yang ditentukan, yang biasa digunakan untuk pemprosesan DTO; 6. Rekod mentakrifkan pemetaan nilai kunci, sesuai untuk penghalaan atau pemetaan negara; 7. Tidak termasuk tidak termasuk jenis yang boleh diperuntukkan, ekstrak mengekstrak jenis yang boleh diperuntukkan untuk penapisan jenis bersama; 8. Tidak dapat dibuang Keluarkan null dan tidak ditentukan untuk meningkatkan keselamatan jenis; 9. Parameter dan Parameter Fungsi Ekstrak Ekstrak dan jenis pulangan secara berasingan untuk memudahkan pemprosesan fungsi pesanan yang lebih tinggi; 10. Ditunggu -tunggu Parses nilai akhir janji bersarang, sesuai untuk derivasi jenis asynchronous. Jenis praktikal ini adalah alat teras untuk meningkatkan kecekapan dan jenis keselamatan dalam pembangunan TypeScript. Selepas menguasai, anda dapat meningkatkan daya tahan dan keteguhan kod anda dengan ketara.

Jenis utiliti TypeScript adalah alat yang sangat diperlukan dalam pembangunan, yang dapat membantu anda mengendalikan jenis dengan lebih cekap dan meningkatkan penyelenggaraan kod dan keselamatan jenis. Menguasai jenis alat terbina dalam ini membolehkan anda menjadi selesa apabila berurusan dengan penukaran jenis yang kompleks. Berikut adalah jenis praktikal teras yang setiap pemaju TypeScript harus mahir.

1. Partial<t></t> : Buat semua atribut Pilihan

Partial<t></t> berguna apabila anda mahu semua sifat objek menjadi pilihan. Ia sering digunakan untuk mengemas kini operasi atau mengkonfigurasi objek.

 pengguna antara muka {
  ID: nombor;
  Nama: String;
  E -mel: String;
}

Function UpdateUser (ID: Nombor, Perubahan: Partial <suser>) {
  // kemas kini hanya medan masuk}

Dengan cara ini, changes hanya boleh mengandungi name , email , atau kosong.

Nota: Partial adalah cetek, dan sifat objek bersarang tidak akan secara automatik menjadi pilihan.

2. Required<T> : Buat semua atribut diperlukan

Bertentangan dengan Partial , Required<T> bertukar semua sifat pilihan ke dalam yang diperlukan. Sesuai untuk senario di mana anda ingin memastikan bahawa semua bidang objek konfigurasi dihuni.

 konfigurasi antara muka {
  Apiurl?: String;
  Timeout?: Nombor;
  Retries?: Nombor;
}

const defaultconfig: diperlukan <config> = {
  Apiurl: &#39;https://api.example.com&#39;,
  Timeout: 5000,
  Retries: 3,
};

Walaupun antara muka asal adalah pilihan, Required memaksa anda untuk menyediakan semua bidang.

3. Readonly<T> : Buat Jenis Baca sahaja

Menghalang objek daripada diubahsuai tanpa disangka -sangka. Sesuai untuk pemalar, pengurusan negeri, atau parameter dalam fungsi yang tidak mahu diubah suai.

 titik antara muka {
  x: nombor;
  y: nombor;
}

Const Origin: ReadOnly <toint> = {x: 0, y: 0};
// asal.x = 10; // ❌ Ralat: Tidak dapat memberikan nilai

Menggunakan Readonly untuk objek besar atau pokok negeri boleh dengan berkesan mengelakkan kesan sampingan.

4. Pick<T, K> : Ekstrak atribut yang ditentukan

Pilih beberapa bidang yang anda sayang dari jenis dan bina jenis baru. Ideal untuk penanaman tindak balas API atau pemilihan medan bentuk.

 pengguna antara muka {
  ID: nombor;
  Nama: String;
  E -mel: String;
  Kata Laluan: String;
}

Jenis publicUser = Pick <user, &#39;id&#39; | &#39;Nama&#39;>;
// {id: nombor; Nama: String}

Elakkan mendedahkan medan sensitif (seperti password ) sambil menyimpan jenis selamat.

5. Omit<T, K> : Tidak termasuk atribut yang ditentukan

Bertentangan dengan Pick , Omit membantu anda menghapuskan medan tertentu. Sangat praktikal apabila mengendalikan DTO (objek pemindahan data).

 Taipkan selamat = omit <user, &#39;kata laluan&#39;>;
// {id: nombor; Nama: String; E -mel: String}

Ia lebih ringkas daripada manual Pick semua bidang yang tidak sensitif, terutamanya apabila terdapat banyak bidang.

6. Record<K, T> : Tentukan jenis pemetaan nilai kunci

Record sangat sesuai apabila anda memerlukan objek yang kunci adalah satu jenis dan nilai yang lain.

 jenis laluan = rekod <string, () => string>;

Laluan Const: Laluan = {
  Laman Utama: () => &#39;/&#39;,
  profil: () => &#39;/profil&#39;,
  Tetapan: () => &#39;/Tetapan&#39;,
};

Ia juga biasa digunakan untuk pemetaan konfigurasi, penghitungan negara, dll.

Contoh yang lebih ketat:

 Taip status = 'Memuatkan' | 'Kejayaan' | 'Ralat';
Mesej Const: Rekod <Status, String> = {
  Memuat: &#39;Memuatkan ...&#39;,
  Kejayaan: &#39;Operasi berjaya&#39;,
  ralat: &#39;ada ralat&#39;,
};

Jika anda menulis kurang atau menulis satu lagi negeri, TypeScript akan melaporkan ralat.

7. Exclude<T, U> dan Extract<T, U> : taipkan penapisan

• Exclude<T, U> : tidak termasuk jenis yang boleh diberikan kepada anda dari t
• Extract<T, U> : ekstrak jenis t yang boleh diberikan kepada anda

 Taip status = 'Idle' | 'Memuatkan' | 'Kejayaan' | 'Ralat';
Taip LoadingStates = Extract <Status, &#39;Memuatkan&#39; | &#39;Idle&#39;>; // &#39;idle&#39; | &#39;Memuatkan&#39;
Jenis ralatonly = tidak termasuk <status, &#39;idle&#39; | &#39;Memuatkan&#39; | &#39;Kejayaan&#39;>; // &#39;ralat&#39;

Sangat berkuasa dalam operasi jenis bersyarat dan kesatuan.

8. NonNullable<T> : Keluarkan null dan tidak ditentukan

Pastikan jenis tidak mengandungi null atau undefined berguna apabila berurusan dengan generik yang mungkin mengandungi nilai null.

 Taip Maybestring = String | NULL | tidak ditentukan;
taipkan pastiString = nonnullable <abeldestring>; // String

Digunakan dengan pengawal jenis, ia dapat meningkatkan ketepatan kesimpulan jenis.

9. Parameters<T> dan ReturnType<T> : Analisis Jenis Fungsi

Mengekstrak parameter dan jenis nilai pulangan dari jenis fungsi amat berguna untuk fungsi pesanan tinggi atau alat ujian.

 fungsi createUser (nama: string, umur: nombor): {id: nombor; Nama: String; umur: nombor} {
  kembali {id: date.now (), nama, umur};
}

taip args = parameter <typeof createuser>; // [String, Nombor]
jenis hasil = returnType <typeof createUser>; // {id: nombor; Nama: String; Umur: Nombor}

Ia boleh digunakan untuk merangkum logik umum seperti fungsi, log, dan cache.

10. Awaited<T> : Menganalisis hasil janji yang mendalam

Sesuai untuk mengendalikan jenis pulangan async/await atau Promise.then Kemudian, ia boleh menghuraikan janji bersarang dengan betul.

 taipkan deeppromise = janji <janji <janji <string >>>;
jenis nilai = ditunggu -tunggu <sepeppromise>; // String

fungsi async fetchuser () {
  kembali {id: 1, nama: &#39;Alice&#39;};
}

jenis pengguna = menunggu <returnType <typeof fetchuser >>; // {id: nombor; Nama: String}

Ia lebih tepat daripada .then() jenis kesimpulan, terutamanya dalam senario asynchronous kompleks.

Pada dasarnya itu sahaja. Jenis -jenis praktikal ini tidak "menunjukkan kemahiran", tetapi alat yang benar -benar dapat meningkatkan kecekapan dan keselamatan ketika menulis TypeScript setiap hari. Adalah disyorkan untuk cuba menggunakannya dalam projek, sebagai contoh:

 Taipkan UpdateUserDTO = Omit <Partial <suser>, &#39;ID&#39;>;
Taip Apiresponse <t> = {data: t; Status: &#39;Kejayaan&#39;} | {error: string; Status: &#39;Ralat&#39;};
Taipkan dataFromResponse <t> = ekstrak <ditunggu -tunggu <t>, {status: &#39;kejayaan&#39;}> [&#39;data&#39;];

Tidak rumit, tetapi mudah diabaikan. Menguasai mereka dan jenis anda benar -benar pengenalan.

Atas ialah kandungan terperinci Jenis Utiliti Typescript Anda Harus Menguasai. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!