0Pricing
TypeScript Academy · Pelajaran

Antarmuka & alias tipe generik

Definisikan antarmuka dan alias tipe generik; tambahkan batasan serta nilai bawaan, dan pahami keunggulan masing-masing.

Antarmuka & alias tipe generik 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: Buat bentuk yang dapat digunakan kembali menggunakan interface generik dan alias tipe. Anda akan menambahkan batasan, nilai bawaan, dan mempelajari perbedaan utamanya.

Ringkasan pelajaran

Tujuan: Terapkan konkurensi terstruktur dengan coroutineScope, pahami propagasi pengecualian, dan gunakan alat pembatalan dengan aman.

Gagasan utama

  • coroutineScope menunggu semua anak selesai; kegagalan membatalkan coroutine saudara.
  • launch langsung gagal dalam cakupan; async menampilkan error saat await().
  • withTimeout membatalkan pekerjaan setelah batas waktu.
  • Bungkus cakupan dengan try/catch untuk menangani pengecualian.

Interface generik

Sebuah interface generik menyimpan parameter tipe. Pemanggil mengganti parameter tersebut dengan tipe konkret (misalnya, Box<number>).

interface Box<T> {
  value: T;
}

const nBox: Box<number> = { value: 42 };
const sBox: Box<string> = { value: "ts" };
console.log(nBox.value, sBox.value);

Alias tipe generik

Sebuah alias tipe juga dapat bersifat generik dan mengekspresikan objek, fungsi, union, atau irisan.

type Pair<A, B> = { first: A; second: B };

const p1: Pair<number, string> = { first: 1, second: "one" };
const p2: Pair<boolean, boolean> = { first: true, second: false };
console.log(p1, p2);

Perilaku penantian coroutineScope

coroutineScope membuat cakupan anak yang hanya selesai setelah semua anaknya selesai.

import kotlinx.coroutines.*

suspend fun doTwoTasks(): Unit = coroutineScope {
    // Both run concurrently and the scope waits for them
    launch { delay(150); println("Task A done") }
    launch { delay(100); println("Task B done") }
    // returning Unit implicitly after children complete
}

fun main() = runBlocking {
    doTwoTasks()
    println("Scope completed")
}

Kegagalan membatalkan coroutine saudara

Jika salah satu anak melemparkan pengecualian, cakupan membatalkan coroutine saudara dan melemparkannya kembali kepada pemanggil; gunakan try/catch di lokasi pemanggilan.

import kotlinx.coroutines.*

suspend fun failingGroup() = coroutineScope {
    val a = launch {
        try {
            repeat(5) { i ->
                println("A $i"); delay(60)
            }
        } finally {
            println("A cancelled")
        }
    }
    launch {
        delay(120)
        throw IllegalStateException("boom") // failure in child
    }
    a.join() // will be cancelled when sibling fails
}

fun main() = runBlocking {
    try {
        failingGroup()
    } catch (e: Exception) {
        println("Caught in caller: ${e.message}")
    }
    println("Caller continues")
}

Batasan

Tambahkan batasan extends agar T menyediakan anggota yang diperlukan (misalnya, id) untuk metode interface.

interface Repository<T extends { id: number }> {
  getById(id: number): T | undefined;
  save(entity: T): void;
}

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

const memRepo: Repository<User> = {
  store: [] as User[],
  getById(id) {
    return this.store.find(u => u.id === id);
  },
  save(u) {
    this.store.push(u);
  }
} as unknown as Repository<User>;

memRepo.save({ id: 1, name: "Ada" });
console.log(memRepo.getById(1));

Error async + await

Pengecualian async muncul saat Anda memanggil await(); tangani dengan try/catch.

import kotlinx.coroutines.*

suspend fun parseAsync(s: String) = coroutineScope {
    val deferred = async {
        delay(50)
        s.toInt() // may throw NumberFormatException
    }
    try {
        println("Result = ${deferred.await()}") // error appears here
    } catch (e: NumberFormatException) {
        println("Handled parse error: ${e::class.simpleName}")
    }
}

fun main() = runBlocking {
    parseAsync("12")
    parseAsync("xx")
}

Nilai bawaan dan perluasan

Sediakan parameter tipe bawaan agar penggunaan lebih praktis dan bangun di atas tipe dengan utilitas (misalnya, Readonly<Box<T>>).

interface ApiResponse<T = unknown> {
  data: T;
  ok: boolean;
}

type ReadonlyBox<T> = Readonly<Box<T>>;

const r1: ApiResponse = { data: "ok", ok: true };      // T defaults to unknown
const r2: ApiResponse<number> = { data: 200, ok: true };
const rb: ReadonlyBox<string> = { value: "fixed" };
// rb.value = "change"; // Error: readonly

Pembatalan withTimeout

Gunakan withTimeout untuk membatasi durasi pekerjaan; opsi ini membatalkan anak dan melempar TimeoutCancellationException.

import kotlinx.coroutines.*

suspend fun slowOp(): Int {
    delay(300) // pretend work
    return 42
}

fun main() = runBlocking {
    try {
        val result = withTimeout(150) { slowOp() } // cancels after 150ms
        println("Got $result")
    } catch (e: TimeoutCancellationException) {
        println("Timed out and cancelled")
    }
}

Perbedaan penggabungan

Interface mendukung penggabungan deklarasi. Alias tipe tidak dapat digabungkan; nama duplikat merupakan error.

interface Settings { theme: string }
interface Settings { lang: string }
// Merged: Settings has { theme: string; lang: string }
const s: Settings = { theme: "dark", lang: "en" };

// type Settings = { foo: string };
// Error: Duplicate identifier 'Settings' for type aliases (no merging)

Aturan kegagalan konkurensi terstruktur

Di coroutineScope, apa yang terjadi jika salah satu korutin anak gagal dengan sebuah pengecualian?

Pemeriksaan interface vs tipe

Pemeriksaan singkat: Pernyataan mana tentang interface generik dan alias tipe yang TRUE?

Rangkuman

Rangkuman: Gunakan interface generik dan alias tipe untuk memodelkan bentuk yang dapat digunakan kembali. Tambahkan batasan, nilai bawaan, dan ingat: hanya interface yang dapat digabungkan.

Ringkasan

Ringkasan: Gunakan coroutineScope untuk mengelompokkan pekerjaan; anak yang gagal membatalkan coroutine saudara. Tangani error dengan try/catch, tampilkan kegagalan async melalui await(), dan batalkan tugas panjang dengan withTimeout.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Antarmuka & alias tipe generik” gratis?

Ya — teks lengkap “Antarmuka & alias tipe generik” 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 “Antarmuka & alias tipe generik”?

Definisikan antarmuka dan alias tipe generik; tambahkan batasan serta nilai bawaan, dan pahami keunggulan masing-masing. 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 “Antarmuka & alias tipe generik” 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. Antarmuka & alias tipe generik
  2. Tipe Kondisional (pengantar) & distribusi atas union
  3. Pola yang dapat digunakan ulang untuk model data
← Kembali ke TypeScript Academy