TypeScript Academy · Pelajaran

Penanganan unknown yang Aman Secara Jenis

Persempit nilai unknown sebelum menggunakannya dengan aman.

Pelajaran 4 dari 413 langkah

Penanganan unknown yang Aman Secara Jenis adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 4 dari 4. 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 4 pelajaran total.

Bekerja dengan Nilai Tak Dikenal secara Aman

Menetapkan tipe data eksternal sebagai unknown baru menyelesaikan separuh pekerjaan. Separuh lainnya adalah menyempitkan nilainya menjadi tipe konkret sebelum digunakan. Pelajaran ini membahas teknik-teknik utama untuk melakukan penyempitan.

function describe(v: unknown): string {
  if (typeof v === 'string') return 'string: ' + v;
  if (typeof v === 'number') return 'number: ' + v;
  return 'other';
}
console.log(describe('hi'), describe(7), describe(true));

Penyempitan Berdasarkan Jenis Nilai

Penjaga typeof adalah alat yang paling sederhana. Penjaga ini menyempitkan unknown menjadi tipe primitif: string, number, boolean, function, object, dan lainnya.

function double(v: unknown): number {
  if (typeof v === 'number') {
    return v * 2; // v is number here
  }
  return 0;
}
console.log(double(21), double('no'));

Penyempitan Berdasarkan Keanggotaan Kelas

Untuk instans kelas, gunakan instanceof. Operator ini menyempitkan unknown menjadi kelas tertentu, sehingga metode dan propertinya dapat digunakan dengan aman.

function handle(v: unknown): string {
  if (v instanceof Date) {
    return v.toISOString(); // v is Date
  }
  return 'not a date';
}
console.log(handle(new Date(0)));

Penyempitan dengan Pemeriksaan Properti

Operator in memeriksa apakah suatu properti ada pada objek, sehingga menyempitkan nilai bertipe objek. Pertama, pastikan nilainya merupakan objek yang memiliki nilai, lalu periksa kuncinya.

function getName(v: unknown): string {
  if (typeof v === 'object' && v !== null && 'name' in v) {
    return String((v as { name: unknown }).name);
  }
  return 'anonymous';
}
console.log(getName({ name: 'Ada' }), getName(5));

Penjaga Tipe Khusus

Penjaga tipe khusus adalah fungsi yang tipe pengembaliannya berupa value is T. Ketika fungsi tersebut mengembalikan true, TypeScript menyempitkan argumennya menjadi T di tempat pemanggilan.

function isString(v: unknown): v is string {
  return typeof v === 'string';
}

function shout(v: unknown): string {
  return isString(v) ? v.toUpperCase() : '?';
}
console.log(shout('hey'), shout(9));

Penjaga untuk Bentuk Objek

Penjaga khusus sangat berguna untuk memvalidasi bentuk objek. Tulislah satu fungsi yang memeriksa semua bidang yang diperlukan, dan bagian kode lainnya dapat mempercayai tipe yang telah dipersempit.

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

function isUser(v: unknown): v is User {
  return typeof v === 'object' && v !== null &&
    'id' in v && 'name' in v;
}
console.log(isUser({ id: 1, name: 'Sam' }), isUser({}));

JSON.parse Mengembalikan Data yang Mirip Nilai Tak Dikenal

JSON.parse bertipe mengembalikan any, yang secara diam-diam melewati keamanan. Praktik terbaiknya adalah menampung hasilnya sebagai unknown dan memvalidasinya sebelum mempercayai strukturnya.

function parseConfig(text: string): unknown {
  return JSON.parse(text);
}
const raw = parseConfig('{"port":8080}');
console.log(typeof raw);

Memvalidasi JSON yang Diuraikan

Gabungkan JSON.parse dengan penjaga tipe untuk mengubah teks yang tidak tepercaya menjadi nilai bertipe dengan aman. Jika validasi gagal, tangani kesalahannya alih-alih mempercayai data yang buruk.

type Config = { port: number };

function isConfig(v: unknown): v is Config {
  return typeof v === 'object' && v !== null &&
    'port' in v && typeof (v as any).port === 'number';
}

const data: unknown = JSON.parse('{"port":8080}');
if (isConfig(data)) console.log('Port:', data.port);

Merangkai Beberapa Penjaga

Untuk masukan yang kompleks, susun penjaga secara bertahap: periksa bentuk broad terlebih dahulu, lalu perinci. Setiap penjaga melakukan penyempitan sedikit demi sedikit, sehingga menghasilkan tipe yang tepat dan aman langkah demi langkah.

function process(v: unknown): string {
  if (Array.isArray(v)) {
    if (v.every((x) => typeof x === 'string')) {
      return v.join('-');
    }
  }
  return 'invalid';
}
console.log(process(['a', 'b']), process([1, 2]));

Melempar Kesalahan pada Data Tidak Valid

Ketika validasi gagal untuk data yang diperlukan, lemparkan kesalahan. Jika digabungkan dengan pembantu kegagalan yang mengembalikan never, pola ini menjaga jalur normal tetap bersih dan bertipe dengan baik.

function asNumber(v: unknown): number {
  if (typeof v === 'number') return v;
  throw new Error('Expected a number');
}
console.log(asNumber(42));
try { asNumber('x'); } catch (e) { console.log('rejected'); }

Menggabungkan Semuanya

Pola lengkapnya: terima data sebagai unknown, sempitkan dengan penjaga, lalu operasikan pada tipe yang tepat. Inilah batas aman antara dunia luar yang tidak bertipe dan kode Anda yang bertipe.

type Point = { x: number; y: number };
function isPoint(v: unknown): v is Point {
  return typeof v === 'object' && v !== null &&
    'x' in v && 'y' in v;
}
const input: unknown = { x: 1, y: 2 };
if (isPoint(input)) console.log(input.x + input.y);

Pemeriksaan Singkat

Ujilah pemahaman Anda tentang cara menangani nilai tak dikenal dengan aman.

Jawab di pelajaran interaktif

Rangkuman: Menangani Nilai Tak Dikenal

Anda telah mempelajari cara menyempitkan unknown dengan:

typeof untuk tipe primitif dan instanceof untuk instans kelas.
Operator in untuk properti objek.
Penjaga tipe khusus yang mengembalikan value is T.
Memvalidasi hasil JSON.parse sebelum mempercayainya.

Kursus berikutnya: pernyataan tipe dan konversi tipe.

function isNonEmpty(v: unknown): v is string {
  return typeof v === 'string' && v.length > 0;
}
console.log(isNonEmpty('hi'), isNonEmpty(''));

Gratis untuk memulai

Belajar TypeScript dengan tutor AI — gratis

Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.

Kursus: 101
Pelajaran: 352

Mulai belajar gratis Lihat kursus lengkapnya

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Penanganan unknown yang Aman Secara Jenis” gratis?

Ya — teks lengkap “Penanganan unknown yang Aman Secara Jenis” 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 4 pelajaran total.

Apa yang akan aku pelajari di “Penanganan unknown yang Aman Secara Jenis”?

Persempit nilai unknown sebelum menggunakannya dengan aman. 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 4 dari 4.

Berapa lama pelajaran “Penanganan unknown yang Aman Secara Jenis” 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

Memahami unknown vs any
Jenis never dan Status yang Mustahil
Jenis void dalam Fungsi
Penanganan unknown yang Aman Secara Jenis

← Kembali ke TypeScript Academy