Cara Menyederhanakan Kode TypeScript Anda Dengan 6 Jenis Utilitas Penting
Table of content:
TypeScript adalah superset JavaScript yang memungkinkan Anda menambahkan pengetikan statis ke basis kode Anda. Dengan sistem tipenya yang kuat, TypeScript menawarkan keterbacaan kode yang lebih baik dan kemampuan untuk menangkap kesalahan selama waktu kompilasi.
Salah satu aspek paling menguntungkan dari TypeScript adalah tipe utilitas bawaannya, yang dapat menyederhanakan upaya pengkodean Anda dan menghemat waktu pengembangan yang berharga. Lihatlah jenis utilitas TypeScript yang harus diketahui ini yang dapat membantu Anda menulis kode yang aman dengan mudah.
1. Jenis Utilitas Parsial
Jenis utilitas Partial TypeScript memungkinkan Anda membuat properti apa pun dari suatu objek opsional. Ini memungkinkan Anda membuat objek dengan properti tertentu yang mungkin hilang atau tidak terdefinisi. Ambil contoh:
Baca Juga:
interface User {
name: string;
age: number;
email: string;
} Menggunakan Jenis utilitas parsialAnda dapat membuat tipe baru dengan semua properti antarmuka Pengguna ditetapkan sebagai opsional:
type OptionalUser = Partial<User> Sekarang, Anda dapat membuat instance dari tipe OptionalUser dengan hanya beberapa properti yang ditentukan:
const user: OptionalUser = { name: "John" }; Anda mungkin menghadapi situasi di mana Anda perlu membuat objek dengan properti opsional tertentu. Ini bisa berguna terutama ketika membangun formulir yang memiliki banyak bidang, karena tidak semuanya mungkin diperlukan dan dalam kasus seperti itu, utilitas parsial bisa menjadi vital.
2. Pilih Jenis Utilitas
Jenis utilitas Pick TypeScript dapat membantu Anda menghasilkan tipe baru dengan memilih hanya subset properti dari tipe yang ada. Ini sangat berguna saat Anda perlu mempersempit objek yang lebih besar menjadi hanya beberapa properti yang diperlukan atau jika Anda ingin menerapkan pengetikan yang ketat pada properti yang Anda perlukan.
interface User {
location: string;
age: number;
email: string;
}type PersonWithoutEmail = Pick<User, 'location' | 'age'>;
const person: PersonWithoutEmail = {
location: 'USA',
age: 30
};
Dalam contoh ini, antarmuka bernama “Pengguna” mendefinisikan tiga properti: email, usia, dan lokasi.
Dengan menggunakan Pilih jenis utilitasAnda dapat mengekstrak properti “location” dan “age” secara selektif dari antarmuka User, menghasilkan pembuatan jenis baru yang disebut “PersonWithoutEmail.”
Anda kemudian dapat membuat instance baru dari tipe “PersonWithoutEmail” dan menetapkan nilai hanya untuk properti “location” dan “age”. Karena properti “email” telah dihilangkan dari tipe ini, Anda tidak dapat menetapkannya ke objek.
Dengan tipe utilitas Pilih, Anda dapat membuat tipe baru yang hanya menggabungkan properti yang Anda inginkan. Ini dapat membantu membuat kode Anda lebih mudah dibaca dan lebih mudah digunakan.
3. Jenis Utilitas Hanya Baca
Tipe readonly menandakan bahwa atribut objek tidak dapat diubah setelah dibuat. Jenis ini menjamin konsistensi data objek dalam jangka panjang, menghasilkan penanganan kode yang lebih lancar dan lebih aman.
interface User {
readonly name: string;
readonly age: number;
readonly email: string;
} Menggunakan Jenis utilitas hanya bacaAnda dapat membuat tipe baru dengan semua properti antarmuka Pengguna ditetapkan sebagai hanya-baca:
type ReadonlyUser = Readonly<User> Anda dapat menentukan nilai properti saat membuat instance ReadonlyUser ::
const user: ReadonlyUser = {
name: "John",
age: 30,
email: "john@example.com"
}; Saat Anda menandai properti objek sebagai hanya-baca, mencoba mengubah nilai properti tersebut menjadi tidak mungkin:
user.name = "Jane";
Jenis Readonly sangat penting dalam situasi di mana Anda ingin memastikan bahwa objek tertentu tidak berubah, bagaimanapun itu direferensikan. Misalnya, jika Anda memiliki objek yang menyimpan pengaturan konfigurasi penting, Anda ingin memastikannya tetap tidak berubah.
4. Jenis Utilitas yang Diperlukan
Tipe ini memastikan bahwa semua properti penting Object ada, sedangkan tipe Partial menawarkan lebih banyak fleksibilitas dengan membiarkan Anda menentukan subset properti sambil membiarkan yang lain opsional. Ini terbukti bermanfaat dalam situasi di mana beberapa properti mungkin tidak diperlukan atau dapat berubah.
interface User {
name: string;
location: number;
address: string;
} Dengan memanfaatkan Jenis utilitas yang diperlukan, dimungkinkan untuk membuat tipe baru yang menggabungkan semua atribut Antarmuka Pengguna sambil mensyaratkan bahwa setiap properti ini harus ada. Pembuatan instance RequiredUser hanya dimungkinkan setelah semua propertinya disetel dengan benar.
const user: RequiredUser = {
name: "John Doe",
location: "USA",
address: "Kansas 9745-0622"
}; Memanfaatkan jenis utilitas yang Diperlukan memastikan bahwa semua properti yang diperlukan ada di dalam objek.
5. Abaikan Jenis Utilitas
Tipe utilitas Omit memungkinkan Anda membuat tipe baru dengan mengecualikan properti tertentu dari tipe yang sudah ada.
interface Person {
location: string;
age: number;
email: string;
}type PersonWithoutEmail = Omit<Person, 'email'>;
const person:PersonWithoutEmail = { location: "USA"; age : 30 };
Antarmuka Orang memiliki tiga properti: usia, lokasi, dan email. Tipe PersonWithoutEmail menggunakan tipe utilitas Omit untuk menyertakan semua properti objek Person, kecuali untuk email. Anda kemudian dapat membuat instance dari tipe baru ini, tanpa menentukan nilai untuk properti email.
Anda harus ingat bahwa tipe utilitas Omit memiliki kemiripan yang signifikan dengan tipe utilitas Pick, karena tipe utilitas ini memberdayakan Anda untuk menyusun tipe baru hanya dengan menggunakan properti yang Anda tentukan.
6. Jenis Utilitas Rekam
Anda dapat menggunakan tipe utilitas Rekam untuk menentukan tipe objek yang kunci dan nilainya memiliki tipe tertentu. Definisinya adalah:
type Record<K extends keyof any, T> = { [P in K]: T;}; Ini mengaitkan tipe T dengan nilai setiap kunci, sedangkan K adalah gabungan kunci dari tipe apa pun. Objek yang dihasilkan memiliki tipe properti P yang disetel ke T.
Pertimbangkan skenario tipe objek dengan kunci string dan nilai numerik. Dalam hal ini, Anda dapat menerapkan Rekam jenis utilitas sebagai:
type MyRecord = Record<string, number>;const myObject: MyRecord = {
"foo": 1,
"bar": 2,
"baz": 3,
}
Contoh ini menetapkan MyRecord sebagai tipe objek dengan kunci string dan nilai numerik. Objek myObject mewujudkan contoh jenis ini, dengan kunci “foo”, “bar”, dan “baz” yang ditetapkan ke nilai yang sesuai.
Merampingkan Kode Dengan Jenis Utilitas TypeScript
Artikel ini mengungkap kekuatan jenis utilitas TypeScript – mereka bisa menjadi aset berharga dalam hal merampingkan kode Anda dan membuat pengembangan lebih cepat dan lebih efisien. Jenis utilitas ini dan TypeScript secara umum, dapat melakukan keajaiban untuk memastikan bahwa kode Anda selalu bebas dari kesalahan dan mematuhi struktur tertentu.
Artikel Terkait
