0Pricing
TypeScript Academy · Pelajaran

Fungsi generik & batasan (extends, parameter bawaan)

Buat fungsi generik, tambahkan batasan dengan extends, dan gunakan parameter tipe bawaan untuk API yang mudah digunakan.

Fungsi generik & batasan (extends, parameter bawaan) adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 3. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar TypeScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus TypeScript Academy mencakup 3 pelajaran total.

Pendahuluan

Tujuan: Jadikan fungsi dapat digunakan kembali dan aman secara tipe dengan generik. Anda akan menentukan parameter tipe, menambahkan batasan extends, dan menetapkan parameter tipe bawaan untuk DX yang lebih baik.

Generik identitas

Tentukan parameter tipe <T>. Kompilator menyimpulkan T dari argumen, sehingga pemanggil jarang perlu menganotasikannya.

function identity<T>(x: T): T {
  return x;
}

const a = identity(42);    // T inferred as number
const b = identity("ts"); // T inferred as string
console.log(a, b);

Batasan dengan extends

Gunakan extends untuk mewajibkan struktur (misalnya, sebuah id). T dapat mencakup lebih banyak bidang berkat pengetikan struktural.

function getId<T extends { id: number }>(item: T): number {
  return item.id;
}

getId({ id: 1, name: "Ada" }); // OK (has id)
// getId({ name: "Lin" });    // Error: missing id

Batasan keyof

Batasi K dengan keyof T agar hanya nama properti dari T yang diizinkan. Tipe hasilnya adalah tipe properti tersebut, yaitu T[K].

function pluck<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

const user = { id: 7, name: "Neo" };
const v1 = pluck(user, "name"); // string
const v2 = pluck(user, "id");   // number
console.log(v1, v2);

Parameter tipe bawaan

Parameter tipe bawaan mengurangi kode berulang. Pemanggil dapat menghilangkan <T> untuk kasus umum, tetapi tetap dapat menggantinya saat diperlukan.

interface Box<T = string> {
  value: T;
}

const aBox: Box = { value: "hi" };       // T defaults to string
const nBox: Box<number> = { value: 123 }; // explicit override
console.log(aBox.value, nBox.value);

Tips

Tips:

  • Biarkan inferensi bekerja; hindari anotasi T yang berlebihan.
  • Tambahkan extends hanya ketika implementasi membutuhkan anggota T.
  • Sediakan nilai bawaan untuk kasus umum yang nyaman digunakan.

Pemeriksaan batasan

Pemeriksaan singkat: Apa yang dipastikan oleh T extends { id: number }?

Rangkuman

Rangkuman: Tentukan fungsi generik, berikan batasan dengan extends, dan tetapkan parameter tipe bawaan agar API tetap fleksibel sekaligus mudah digunakan.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Fungsi generik & batasan (extends, parameter bawaan)” gratis?

Ya — teks lengkap “Fungsi generik & batasan (extends, parameter bawaan)” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus TypeScript Academy, upgrade ke CoddyKit PRO. Kursus TypeScript Academy mencakup 3 pelajaran total.

Apa yang akan aku pelajari di “Fungsi generik & batasan (extends, parameter bawaan)”?

Buat fungsi generik, tambahkan batasan dengan extends, dan gunakan parameter tipe bawaan untuk API yang mudah digunakan. Kamu berlatih TypeScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai TypeScript Academy?

Tidak diperlukan pengalaman sebelumnya. TypeScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 3.

Berapa lama pelajaran “Fungsi generik & batasan (extends, parameter bawaan)” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. Fungsi generik & batasan (extends, parameter bawaan)
  2. Partial, Readonly, Record, Pick, Omit
  3. Tipe akses keyof/terindeks (pengantar)
← Kembali ke TypeScript Academy